This is a migrated thread and some comments may be shown as answers.

[Solved] How to remove shadow (.ruShadow) from Progress Area?

1 Answer 180 Views

Upload (Obsolete)

This is a migrated thread and some comments may be shown as answers.

jgill asked on 26 Sep 2009, 12:46 AM

I am trying to remove the border and shadhow from the ProgressArea, but I cannot seem to get rid of the styling on .ruShadow. How would I remove any kind of border and drop shadow from the ProgressArea. ruShadow is not specificed in the CSS for the Skin so it seems I can only override it on the ProgressTemple, but I keep getting two divs rendered for ruShadow (the one automatically added by the ProgressArea and the one I seem to be adding below).

    
                                               <ProgressTemplate> 
        
                                               <div class="ruShadow" style="background: transparent; margin: 0; padding: 0;">  
        
                                                   <div id="radProgressArea_Panel">  
        
                                                        <ul class="ruProgress" style="border-style: none ;border-width: 0; padding-top: 15px;"> 
        
                                                           <li class="ruFilePortion">  
        
                                                               <div class="ruBar"> 
        
                                                                    <div runat="server" id="PrimaryProgressBarInnerDiv"><!-- --></div> 
        
                                                                </div> 
        
                                                                Part:  <span runat="server" id="PrimaryPercent"></span>% (<span runat="server" id="PrimaryValue"></span>) 
        
                                                                <br /> 
        
                                                                Total:  <span runat="server" id="PrimaryTotal"></span> 
        
                                                            </li> 
        
                                                            <li class="ruFileCount">     
        
                                                                <div class="ruBar"> 
        
                                                                    <div runat="server" id="SecondaryProgressBarInnerDiv"><!-- --></div> 
        
                                                                </div> 
        
                                                                Part:  <span runat="server" id="SecondaryPercent"></span>% (<span runat="server" id="SecondaryValue"></span>) 
        
                                                                <br /> 
        
                                                                Total:  <span runat="server" id="SecondaryTotal"></span> 
        
                                                            </li> 
        
                                                        </ul> 
        
                                                    </div> 
        
                                                </div> 
        
                                                </ProgressTemplate>

1 Answer, 1 is accepted

answered on 26 Sep 2009, 01:40 PM

Hello jgill,

You can use the following CSS to obtain the desired view:

    
            .RadUploadProgressArea > .ruShadow, 
        
                    .RadUploadProgressArea .ruShadow > div, 
        
                    .RadUploadProgressArea 
        
                    { 
        
                        background:none !important; 
        
                    }

Regards,
Genady Sergeev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.