Panel bar item height

6 posts, 0 answers
  1. jeevitha
    jeevitha avatar
    63 posts
    Member since:
    Sep 2008

    Posted 27 Nov 2009 Link to this post

    Hi,
    I need to reduce the panel bar item height. I have overwrite in the css file. but its not reflecting in the UI (other chanes are reflecting). Pls help me to achieve this

    .RadPanelBar_Web20 .rpGroup .rpLink,
    .RadPanelBar_Web20 .rpGroup .rpTemplate
    {
        color: #000;
        background-color: transparent;
        background-image: none;
            
        line-height: 5px;
        min-height:  5px;
    }
    * html .RadPanelBar_Web20 .rpGroup .rpLink { height: 5px; }

    Thanks,
    Jeevitha
  2. Paul
    Admin
    Paul avatar
    4281 posts

    Posted 27 Nov 2009 Link to this post

    Hi Jeevitha,

    Just add the !important clause, i.e.

    .RadPanelBar_Web20 .rpGroup .rpLink,
    .RadPanelBar_Web20 .rpGroup .rpTemplate
    {
        color: #000 !important;
        background-color: transparent !important;
        background-image: none !important;
        line-height: 5px !important;
        min-height: 5px !important;
    }
    * html .RadPanelBar_Web20 .rpGroup .rpLink
    {
        height: 5px !important;
    }


    Best wishes,
    Paul
    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.
  3. jeevitha
    jeevitha avatar
    63 posts
    Member since:
    Sep 2008

    Posted 27 Nov 2009 Link to this post

    Thanks Paul
  4. jeevitha
    jeevitha avatar
    63 posts
    Member since:
    Sep 2008

    Posted 02 Dec 2009 Link to this post

    I have one more question. how shall we make the font as normal in submenu items. The mian menu items are looks bold if i use the folg code. but this style applied for submenu also. i want my submenu with normal font.


    .RadPanelBar_Web20 .rpLink,
    .RadPanelBar_Web20 .rpTemplate
    {
        color: #fff;
        font: bold 12px/24px Verdena, Arial, sans-serif;
    }

    I tried the follg but not worked

    RadPanelBar_Web20.rpText
    {
        font-size:11px;
        font-family:Verdana;
        font-weight:normal !important;
    }
  5. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 02 Dec 2009 Link to this post

    Hi Jeevitha,

    Try out the following code instead:
    aspx:
    <telerik:RadPanelBar ID="RadPanelBar1" Skin="Web20" runat="server"
        <Items> 
          <telerik:RadPanelItem CssClass="PanelItem" Text="item1"
            <Items> 
                <telerik:RadPanelItem Text="subitem1"></telerik:RadPanelItem> 
                <telerik:RadPanelItem Text="subitem2"></telerik:RadPanelItem> 
                <telerik:RadPanelItem Text="subitem3"></telerik:RadPanelItem> 
                <telerik:RadPanelItem Text="subitem4"></telerik:RadPanelItem>     
           </Items> 
         </telerik:RadPanelItem> 
         <telerik:RadPanelItem CssClass="PanelItem" Text="item2"></telerik:RadPanelItem> 
         <telerik:RadPanelItem CssClass="PanelItem" Text="item3"></telerik:RadPanelItem> 
       </Items> 
    </telerik:RadPanelBar> 

    css:
    .PanelItem 
        { 
            color: #fff; 
            font: bold 24px Verdena, Arial, sans-serif !important; 
        } 

    Hope this helps..
    Princy.
  6. jeevitha
    jeevitha avatar
    63 posts
    Member since:
    Sep 2008

    Posted 02 Dec 2009 Link to this post

    Thanks Princy it works..
Back to Top