RadToolBar

[Johnny]

hi can i control RadToolBar height, i want height in 30px
i tried but nothing happened

 

<telerik:RadToolBar ID="RadToolBar1"  style="z-index:90001"   runat="server">
                                                   <Items>

                                                       <telerik:RadToolBarDropDown >
                                                       <Buttons>
                                                               <telerik:RadToolBarButton   Text="Content Search" >

                                                               </telerik:RadToolBarButton>
                                                          </Buttons>
                                                       </telerik:RadToolBarDropDown>



                                                      <telerik:RadToolBarButton   >
                                                      <ItemTemplate>
                                                          <telerik:RadTextBox ID="mainSearchTxt" runat="server">
                                                          </telerik:RadTextBox>
                                                      </ItemTemplate>
                                                      </telerik:RadToolBarButton>
                                                      <telerik:RadToolBarButton   Text="Search"  ></telerik:RadToolBarButton>
                                                   </Items>
                                                   </telerik:RadToolBar>

why the "Content Search" Text property of RadToolBarButton shown in 2 rows?

[Richard]

Johnny:

I do not believe that RadToolBar supports setting the width and height properties. Take a look at the Stretching RadToolBar to fit the width of the page for some workarounds to this.

Cheers!

[Kate]

Hi Johnny,

You could set height to the RadToolBar control  ( <telerik:RadToolBar ID="RadToolBar1" runat="server" Height="30px"> ) and use the following css class so that the text of the RadToolBarButton stays on one row:

<style type="text/css">
    div.RadToolBarDropDown_Default ul.rtbActive li.rtbItem a.rtbWrap
         {
            width: 146px !important;
         }
     </style>

All the best,
Kate
the Telerik team

[Johnny]

hi kate
please add RadToolBar in ur aspx then set Height="30px" nothing will happen
pls guide me how to control the height of the RadToolBar?

[Shinu]

Hello,

I have tried to set the height in aspx itself and it worked as expected at my end. You can experience this by setting higher/lower value to height other than 30px. Here is the screenshot.
Another suggestion is you can try with the following CSS.
CSS:

<style type="text/css">
 .rtbUL
  {
    height:60px !important;
  }
</style>

-Shinu.

[Johnny]

so if i use RadToolbar i couldn't fix 30px heigt?
better i don't use RadToolBar

[Shinu]

Hello,

I suppose 30px is the default height of RadToolBar, that is why it is not showing any change.

-Shinu.

[William]

I have a similar problem, where I am using css on my RadToolBar to left-justify some RadToolBarButtons, and right-justify other RadToolBarButtons.  Unfortunately, when the styling is applied, each of my separator buttons are causing a line break.  I'd like to keep the ToolBar to a single line. 

Is there a way to override the generation of the line break when I apply isSeparator to true?

[Kate]

Hello William,

Can you please provide your markup as well as the css styles that you apply to the RadToolBar so I could test it locally and help you out ?

Kind regards,
Kate
the Telerik team

[MarkSci]

I'm experiencing the same issue, but it seems to depend on the client machine (I do not experience a line break but a colleague does). Is there a solution for this? Thanks