This is a migrated thread and some comments may be shown as answers.

Rendering Issue

6 Answers 37 Views
ToolBar
This is a migrated thread and some comments may be shown as answers.
Rob
Top achievements
Rank 1
Rob asked on 21 Aug 2012, 03:32 PM
I am using v2011.3.527.35 and I am having a rendering issue with the RadToolBar in IE8.  Please see attachment (RadToolBar2001.jpg).  There seems to be some overlapping or incorrect offset.  There is a default skin to use the "Default" theme.  The OnLoad function only set the visibility.  I am using the previous versions images, I believe.  Suggestions?

<telerik:RadToolBar ID="RadToolBar1" runat="server" EnableRoundedCorners="true" Style="float: right;"
                    OnButtonClick="MainToolbar_ButtonClick" OnClientButtonClicking="OnClientButtonClicking">
        <Items>
            <telerik:RadToolBarButton CommandName="Back" Text="Back" ImageUrl="~/Images/BackButton.gif" />
            <telerik:RadToolBarButton CommandName="Export" OnLoad="InquiryOrMaintenanceControl_Load" Text="Export" ImageUrl="~/Images/Export.gif" />
            <telerik:RadToolBarButton CommandName="Reset" OnLoad="InquiryOrMaintenanceControl_Load" Text="Reset" ImageUrl="~/Images/Reset.gif" />
            <telerik:RadToolBarButton CommandName="DeleteAll" OnLoad="DeleteAllButton_Load" Text="Delete All" ImageUrl="~/Images/Delete.gif" DisabledImageUrl="~/Images/Delete_d.gif" />
            <telerik:RadToolBarButton CommandName="Retrieve" OnLoad="InquiryOrMaintenanceControl_Load" Text="Retrieve" ImageUrl="~/Images/Retrieve1.gif" />
            <telerik:RadToolBarButton CommandName="Import" OnLoad="MaintenanceOnlyControl_Load" Text="Upload" ImageUrl="~/Images/uploadIcon.gif" />
        </Items>
</telerik:RadToolBar>

Thanks,
Rob

6 Answers, 1 is accepted

Sort by
0
Kate
Telerik team
answered on 24 Aug 2012, 09:02 AM
Hi Rob,

I tested the code that you provided with the 2011.3.1305.40 version of the Telerik controls but I cannot get the appearance that you get. Can you check if you apply any custom styles that might be causing the problematic appearance?

Regards,
Kate
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Rob
Top achievements
Rank 1
answered on 04 Sep 2012, 02:40 PM
Hi Kate,

I found the customized styles that were causing the rendering issues and excluded them from the solution.  Now all I need is to get the rounded corner appearance of the RadToolBar for v2011.3.527.35.  I need to maintain this version for the app, because it was developed a couple of years ago w/ the older version and works well.   I have EnableRoundedCorners="true" but the corners of the RadToolBar are not rounded.  They are square.  Do you have any suggestions?

Thanks,
Rob

0
Kate
Telerik team
answered on 07 Sep 2012, 09:48 AM
Hi Rob,

Thank you for letting me know.

Attached to this ticket you can find a simplified runnable page where I implemented rounded corners for the RadToolBar control. However, please keep in mind that if you need to alter the width of the RadToolBar control you will also need to alter the width of the background image that is applied (background.png).

Considering the property that you set, indeed all it currently does is to set a css class whose definition is still not implemented.

Please give it a try and let me know how it goes and if you have any further questions I can assist you with.

Kind regards,
Kate
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Kate
Telerik team
answered on 07 Sep 2012, 09:49 AM
Here is the attached file.

All the best,
Kate
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Rob
Top achievements
Rank 1
answered on 17 Sep 2012, 05:15 PM
I applied your most recently attached code example and the ToolBar is rendering better, but there are still 2 issues. 

1)  If I define the ToolBar control to have 5 buttons with separators in between each button, the rounded corners background image only covers the width of 3 1/2 buttons. 

2) The corners are rounded on the left side of the control, but not on the right side.  Can you make the corners on the right side of the control rounded as well.

We're almost there!

Thanks,
Rob
0
Kate
Telerik team
answered on 18 Sep 2012, 07:44 AM
Hello Rob,

Whit the simplified project that I sent you it is expected that you get this appearance since the sprite image that I used has a fixed width (background.png). Since the project that I attached to my previous post is a simplified example you can further alter it and enlarge the sprite image so that it matches the width of the toolbar in your scenario.  

All the best,
Kate
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
ToolBar
Asked by
Rob
Top achievements
Rank 1
Answers by
Kate
Telerik team
Rob
Top achievements
Rank 1
Share this question
or