Home / Community & Support / Developer Productivity Tools Forums / ASP.NET > Panelbar > Setting panel color to theme color

• Rajesh

  Posted on May 9, 2011 (permalink)

  Hi,
  
     I have a panel which contains some images. But these images occupy only some portion of the panel. rest of the panel remain unoccupied. I want to set color of the unoccupied part to default color of the selected theme. I'm attaching the image of that control. I want to set theme color for the the aread which is shown colored as Red.
  
  Following is the code:-
  
  

   

  <telerik:RadPane ID="rPanTimeCardSelector" runat="server" Width="22px" Height="100%" BackColor="Red"

   

   

  Scrolling="Y">

   

   

  <div id="dvDockZone" runat="server" style="width: 28px; left: 0px;">

   

   

  <telerik:RadSlidingZone ID="RecSelectSlidingZone" runat="server" Height="100%" Width="22"

   

   

  ExpandedPaneId="RecSelectPane">

   

   

  <telerik:RadSlidingPane ID="RecSelectPane" EnableDock="true" runat="server" Width="615"

   

   

  IconUrl="~/Images/TimeCards.png" MinWidth="180" Scrolling="Y" TabView="ImageOnly">

   

   

  <TCS:TimeCardSelector ID="ucTimeCardSelector" runat="server" />

   

   

  </telerik:RadSlidingPane>

   

   

  </telerik:RadSlidingZone>

   

   

  <VCR:VCRButtons ID="ucVCRButtons" runat="server" />

   

   

  </div>

   

   

  </telerik:RadPane>
  
  Thanks
  Rajesh

   

  Attached files

  • Color.PNG

• Dobromir Dobromir

  Posted on May 12, 2011 (permalink)

  Hi Rajesh,
  
  I am not quite sure I understand the question. In the provided code snippet you are setting the background color of the pane using the BackColor property, if you want to apply background color on a single pane using CSS, you need to set CssClass property to the required pane and use the following CSS selector:
  

  <style type="text/css">

      .rspPane div.myClass

      {

          background-color: Lime;   

      }

  </style>

   

  .......

   

  <telerik:RadSplitter ID="RadSplitter1" runat="server" Width="100%" Height="100%">

      <telerik:RadPane ID="RadPane1" runat="server"></telerik:RadPane>

      <telerik:RadPane ID="RadPane2" runat="server" CssClass="myClass" Width="22px">

          <telerik:RadSlidingZone ID="RadSlidingZone1" runat="server">

              <telerik:RadSlidingPane ID="RadSlidingPane1" runat="server" Title="Pane1"></telerik:RadSlidingPane>

          </telerik:RadSlidingZone>

      </telerik:RadPane>

  </telerik:RadSplitter>

  
  In addition, I noticed that the pane containing the sliding zone have additional content ( contains a user control and a <div> is wrapping the sliding). This configuration is not correct and may cause unexpected side effects - RadSlidingZone must be direct child of a RadPane.
  
  Regards,
  Dobromir
  the Telerik team

  Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / ASP.NET > Panelbar > Setting panel color to theme color