How to reduce the height of the Buttons and the height of the Toolbar?

2 posts, 0 answers
  1. Sri
    Sri avatar
    22 posts
    Member since:
    Jun 2009

    Posted 26 Jun 2009 Link to this post

    I have the following Code and I tried some of the CSS Style that are given in other forums to reduce the height of the toolbar. But none of them worked. Can you help me to refix the height of the Toolbar?

     

    <telerik:RadToolBar ID="RdToolBar" runat="server" Width="100%" OnClientButtonClicking="OnButtonClicking">

     

     

    <Items>

     

     

    <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/AddNew_Disabled.gif"

     

     

    ImageUrl="~/Images/MenuImages/AddNew.gif" Text="Add New" Value="ADDNEW">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" ImageUrl="~/Images/MenuImages/Attributes.gif"

     

     

    Text="Attributes" Value="ATTRIBUTES" DisabledImageUrl="~/Images/MenuImages/Attributes_Disabled.gif">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" IsSeparator="True" Text="Separator" Value="Separator">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" ImageUrl="~/Images/MenuImages/Cut.gif" Text="Cut"

     

     

    Value="CUT" DisabledImageUrl="~/Images/MenuImages/Cut_Disabled.gif">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" ImageUrl="~/Images/MenuImages/Paste.gif"

     

     

    Text="Paste" Value="PASTE" DisabledImageUrl="~/Images/MenuImages/Paste_Disabled.gif">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" ImageUrl="~/Images/MenuImages/Rename.gif"

     

     

    Text="Rename" Value="RENAME" DisabledImageUrl="~/Images/MenuImages/Rename_Disabled.gif">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" ImageUrl="~/Images/MenuImages/Delete.gif"

     

     

    Text="Delete" Value="DELETE" DisabledImageUrl="~/Images/MenuImages/Delete_Disabled.gif">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" ImageUrl="~/Images/MenuImages/Search.gif"

     

     

    Text="Search" Value="SEARCH" DisabledImageUrl="~/Images/MenuImages/Search_Disabled.gif">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" IsSeparator="True" Text="Separator" Value="SEPARATOR">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/Refresh_Disabled.gif"

     

     

    ImageUrl="~/Images/MenuImages/Refresh.gif" Text="Refresh" Value="REFRESH">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/ExpandAll_Disabled.gif"

     

     

    ImageUrl="~/Images/MenuImages/ExpandAll.gif" Text="Expand All" Value="EXPAND_ALL">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" IsSeparator="True" Text="Separator" Value="SEPARATOR">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/Display_Disabled.gif"

     

     

    ImageUrl="~/Images/MenuImages/Display.gif" Text="View Hidden" Value="VIEW_HIDDEN"

     

     

    CheckOnClick="True" AllowSelfUncheck="True">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/Publish_Disabled.gif"

     

     

    ImageUrl="~/Images/MenuImages/Publish.gif" Text="Publish" Value="PUBLISH">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/Print_Disabled.gif"

     

     

    ImageUrl="~/Images/MenuImages/Print.gif" Text="Print" Value="PRINT">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" IsSeparator="True" Text="Separator" Value="SEPARATOR">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/JJInfo_Disabled.gif"

     

     

    ImageUrl="~/Images/MenuImages/JJInfo.gif" Text="Help" Value="HELP">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" IsSeparator="True" Text="Separator" Value="SEPARATOR">

     

     

    </telerik:RadToolBarButton>

     

     

    <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/Exit.gif"

     

     

    ImageUrl="~/Images/MenuImages/Exit.gif" Text="Exit" Value="EXIT">

     

     

    </telerik:RadToolBarButton>

     

     

    </Items>

     

     

    </telerik:RadToolBar>

     

  2. Paul
    Admin
    Paul avatar
    4281 posts

    Posted 30 Jun 2009 Link to this post

    Hi Sri,

    Here's a sample code snippet that shows the needed approach.

    <html xmlns="http://www.w3.org/1999/xhtml"
    <head runat="server"
        <title></title
        <style type="text/css"
            div.RadToolBar .rtbInner 
            { 
                padding: 0; 
            } 
            div.RadToolBar_Default .rtbMiddle 
            { 
                border: none; 
                height: 24px; 
            } 
            div.RadToolBar_Default .rtbOuter 
            { 
                height: 24px; 
            } 
            div.RadToolBar_Default .rtbIn 
            { 
                padding-top: 0px; 
                padding-bottom: 0px; 
            } 
            div.RadToolBar_Default .rtbWrap 
            { 
                line-height: 18px; 
            } 
        </style> 
    </head> 
    <body> 
        <form id="form1" runat="server"
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server"
        </telerik:RadScriptManager> 
        <telerik:RadToolBar ID="RdToolBar" runat="server" Width="100%" OnClientButtonClicking="OnButtonClicking"
            <Items> 
                <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/AddNew_Disabled.gif" 
                    ImageUrl="~/Images/MenuImages/AddNew.gif" Text="Add New" Value="ADDNEW"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" ImageUrl="~/Images/MenuImages/Attributes.gif" 
                    Text="Attributes" Value="ATTRIBUTES" DisabledImageUrl="~/Images/MenuImages/Attributes_Disabled.gif"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" IsSeparator="True" Text="Separator" Value="Separator"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" ImageUrl="~/Images/MenuImages/Cut.gif" Text="Cut" 
                    Value="CUT" DisabledImageUrl="~/Images/MenuImages/Cut_Disabled.gif"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" ImageUrl="~/Images/MenuImages/Paste.gif" 
                    Text="Paste" Value="PASTE" DisabledImageUrl="~/Images/MenuImages/Paste_Disabled.gif"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" ImageUrl="~/Images/MenuImages/Rename.gif" 
                    Text="Rename" Value="RENAME" DisabledImageUrl="~/Images/MenuImages/Rename_Disabled.gif"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" ImageUrl="~/Images/MenuImages/Delete.gif" 
                    Text="Delete" Value="DELETE" DisabledImageUrl="~/Images/MenuImages/Delete_Disabled.gif"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" ImageUrl="~/Images/MenuImages/Search.gif" 
                    Text="Search" Value="SEARCH" DisabledImageUrl="~/Images/MenuImages/Search_Disabled.gif"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" IsSeparator="True" Text="Separator" Value="SEPARATOR"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/Refresh_Disabled.gif" 
                    ImageUrl="~/Images/MenuImages/Refresh.gif" Text="Refresh" Value="REFRESH"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/ExpandAll_Disabled.gif" 
                    ImageUrl="~/Images/MenuImages/ExpandAll.gif" Text="Expand All" Value="EXPAND_ALL"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" IsSeparator="True" Text="Separator" Value="SEPARATOR"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/Display_Disabled.gif" 
                    ImageUrl="~/Images/MenuImages/Display.gif" Text="View Hidden" Value="VIEW_HIDDEN" 
                    CheckOnClick="True" AllowSelfUnCheck="True"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/Publish_Disabled.gif" 
                    ImageUrl="~/Images/MenuImages/Publish.gif" Text="Publish" Value="PUBLISH"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/Print_Disabled.gif" 
                    ImageUrl="~/Images/MenuImages/Print.gif" Text="Print" Value="PRINT"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" IsSeparator="True" Text="Separator" Value="SEPARATOR"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/JJInfo_Disabled.gif" 
                    ImageUrl="~/Images/MenuImages/JJInfo.gif" Text="Help" Value="HELP"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" IsSeparator="True" Text="Separator" Value="SEPARATOR"
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" DisabledImageUrl="~/Images/MenuImages/Exit.gif" 
                    ImageUrl="~/Images/MenuImages/Exit.gif" Text="Exit" Value="EXIT"
                </telerik:RadToolBarButton> 
            </Items> 
        </telerik:RadToolBar> 
        </form> 
    </body> 
    </html> 


    Greetings,
    Paul
    the Telerik team

    Instantly find answers to your questions on the newTelerik Support Portal.
    Check out the tipsfor optimizing your support resource searches.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top