I recently updated my controls from a 2011 release to the very latest 2012 release. After doing this, the ribbonbars on a lot of my pages have a problem regarding the buttongroup text, as illustrated by the attached screenshot.
You can see that the "View Status" and "Reference" groups text is fine - it's center-aligned and doesn't cut off. However, the "Account Details" and what should be "View Ownership" group text is clipped and left-aligned.
As an experiment I removed the "Closed" button from the "View Status" group, and that group then had the same problems as the "Account Details" group - the text is cut off.
Here is the code in case you need to recreate what i've done:
You can see that the "View Status" and "Reference" groups text is fine - it's center-aligned and doesn't cut off. However, the "Account Details" and what should be "View Ownership" group text is clipped and left-aligned.
As an experiment I removed the "Closed" button from the "View Status" group, and that group then had the same problems as the "Account Details" group - the text is cut off.
Here is the code in case you need to recreate what i've done:
<
telerik:RadRibbonBar
ID
=
"rrbAdmin"
runat
=
"server"
CssClass
=
"ribbonBar"
OnClientSelectedTabChanged
=
"showHeaderRibbonBarResizeOverride"
>
<
telerik:RibbonBarTab
Text
=
"Browse"
ID
=
"rbtBrowse"
/>
<
telerik:RibbonBarTab
Text
=
"Forms"
ID
=
"rbtUsers"
>
<
telerik:RibbonBarGroup
Text
=
"Account Details"
>
<
Items
>
<
telerik:RibbonBarButton
Text="Create New<br/>Account" Value="CreateAccountForm" Size="Large"
ImageUrlLarge="../../Images/Icons_32/add_application.png" Visible="false" />
<
telerik:RibbonBarButton
Text="View/Edit<br/>Account Form" Value="EditAccountForm" Size="Large" Enabled="false"
ImageUrlLarge="../../Images/Icons_32/edit.png" />
</
Items
>
</
telerik:RibbonBarGroup
>
<
telerik:RibbonBarGroup
Text
=
"View Status"
Value
=
"ViewStatus"
>
<
Items
>
<
telerik:RibbonBarToggleList
ID
=
"ViewList"
>
<
ToggleButtons
>
<
telerik:RibbonBarToggleButton
Size
=
"Large"
Text
=
"Open"
Value
=
"btnOpen"
Toggled
=
"true"
ImageUrlLarge
=
"../../Images/Icons_32/open.png"
/>
<
telerik:RibbonBarToggleButton
Size
=
"Large"
Text
=
"Closed"
Value
=
"btnClosed"
ImageUrlLarge
=
"../../Images/Icons_32/closed.png"
/>
</
ToggleButtons
>
</
telerik:RibbonBarToggleList
>
</
Items
>
</
telerik:RibbonBarGroup
>
<
telerik:RibbonBarGroup
Text
=
"View Ownership"
Value
=
"ViewOwnership"
>
<
Items
>
<
telerik:RibbonBarToggleList
ID
=
"RibbonBarToggleList1"
>
<
ToggleButtons
>
<
telerik:RibbonBarToggleButton
Size
=
"Large"
Text
=
"My Accounts"
Value
=
"btnMyAccounts"
Toggled
=
"true"
ImageUrlLarge
=
"../../Images/Icons_32/user.png"
/>
<
telerik:RibbonBarToggleButton
Size
=
"Large"
Text
=
"All Accounts"
Value
=
"btnAllAccounts"
ImageUrlLarge
=
"../../Images/Icons_32/all.png"
/>
</
ToggleButtons
>
</
telerik:RibbonBarToggleList
>
</
Items
>
</
telerik:RibbonBarGroup
>
<
telerik:RibbonBarGroup
Text
=
"Reference"
>
<
Items
>
<
telerik:RibbonBarButton
Size
=
"Large"
Text="Group Authority<br />Matrix"
ImageUrlLarge="../../Images/Icons_32/attachment.png" />
</
Items
>
</
telerik:RibbonBarGroup
>
</
telerik:RibbonBarTab
>
<
telerik:RibbonBarTab
Text
=
"Reporting"
ID
=
"RibbonBarTab1"
Value
=
"Reporting"
>
<
telerik:RibbonBarGroup
Text
=
"Report Type"
>
<
Items
>
<
telerik:RibbonBarToggleList
ID
=
"RibbonBarToggleList2"
>
<
ToggleButtons
>
<
telerik:RibbonBarToggleButton
Size
=
"Large"
Text
=
"By Period"
Value
=
"byPeriod"
Toggled
=
"true"
ImageUrlLarge
=
"../../Images/Icons_32/calendar.png"
/>
<
telerik:RibbonBarToggleButton
Size
=
"Large"
Text
=
"By Customer"
Value
=
"byCustomer"
ImageUrlLarge
=
"../../Images/Icons_32/user.png"
/>
</
ToggleButtons
>
</
telerik:RibbonBarToggleList
>
</
Items
>
</
telerik:RibbonBarGroup
>
</
telerik:RibbonBarTab
>
</
telerik:RadRibbonBar
>