Aimee Rasmussen
Top achievements
Rank 1
Rank 1
Aimee Rasmussen
asked on 02 Aug 2010, 04:57 PM
I'm running into a strange issue with FireFox and the way it's rendering the Vista skin for a RadDock TitleBarTemplate. See screenshots below.
I have a page with a RadDockLayout and 5 individual RadDockZones and RadDocks. Inside of the zones I have a TitleBarTemplate defined with some labels/buttons/hyperlinks, etc., and then I'm using a user control to display to actual contents of the dock inside the ContentTemplate as displayed below.
4 of the docks have a user control which has a RadListView, and the other dock has a user control with a RadGrid inside of it. The dock with the RadGrid is rendering perfectly in both IE and FireFox but the other 4 docks (with ListViews) are not. The titlebar template is displaying this weird squiggly curtain-looking thing. I checked it out both in IE developer tools and Firebug and I'm sure it has to do with the embedded image HorizontalSprite.gif. That sprite shows three different versions of the same header. IE is using the squared version but FF is using the middle image. How do I make FF display the same image as IE??
Markup Example:
I have a page with a RadDockLayout and 5 individual RadDockZones and RadDocks. Inside of the zones I have a TitleBarTemplate defined with some labels/buttons/hyperlinks, etc., and then I'm using a user control to display to actual contents of the dock inside the ContentTemplate as displayed below.
4 of the docks have a user control which has a RadListView, and the other dock has a user control with a RadGrid inside of it. The dock with the RadGrid is rendering perfectly in both IE and FireFox but the other 4 docks (with ListViews) are not. The titlebar template is displaying this weird squiggly curtain-looking thing. I checked it out both in IE developer tools and Firebug and I'm sure it has to do with the embedded image HorizontalSprite.gif. That sprite shows three different versions of the same header. IE is using the squared version but FF is using the middle image. How do I make FF display the same image as IE??
Markup Example:
<telerik:RadDockZone ID="RadDockZoneInbox" runat="server" Width="99%"BorderStyle="None" EnableEmbeddedBaseStylesheet="true" EnableAjaxSkinRendering="true"> <telerik:RadDock ID="RadDockInbox" runat="server" width="99%" DefaultCommands="None" EnableAjaxSkinRendering="true" DockMode="Docked" Skin="Vista" EnableDrag="False" Index="0" Tag=""> <TitlebarTemplate> <asp:Label ID="lblInbox" font-bold="true" font-size="Large" runat="server" meta:resourcekey="lblInbox"></asp:Label> <asp:ImageButton runat="server" ID="btnUploadTransactions" style="position: absolute; margin: 1px; padding: 0; right: 10px;" OnClientClick="javascript: openWinPostLogin('/../TransactionPages/TransactionUpload.aspx', 'Modal', '.70', '.58');" /> <asp:ImageButton runat="server" ID="btnDownloadTransactions" style="position: absolute; margin: 1px; padding: 0; right: 170px;" OnClientClick="DownloadTransactions();"/> </TitlebarTemplate> <ContentTemplate> <UC5:InboxWidget ID="InboxWidget1" runat="server"/> </ContentTemplate> </telerik:RadDock> </telerik:RadDockZone> 1 Answer, 1 is accepted
0
Hi Aimee,
I have tried to reproduce the problem but to no avail. I have used the following code:
Attached is result01.gif showing the result in Firefox.
Could you send us a live url or a simple project where the problem exists, so we will be able to investigate it further?
Best wishes,
Bojo
the Telerik team
I have tried to reproduce the problem but to no avail. I have used the following code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <telerik:RadDockZone ID="RadDockZoneInbox" runat="server" Width="99%" BorderStyle="None" EnableEmbeddedBaseStylesheet="true" EnableAjaxSkinRendering="true"> <telerik:RadDock ID="RadDockInbox" runat="server" Width="99%" DefaultCommands="None" EnableAjaxSkinRendering="true" DockMode="Docked" Skin="Vista" EnableDrag="False" Index="0" Tag=""> <TitlebarTemplate> <asp:Label ID="lblInbox" Font-Bold="true" Font-Size="Large" runat="server" meta:resourcekey="lblInbox" Text="Titile"></asp:Label> <asp:ImageButton runat="server" ID="btnUploadTransactions" Style="position: absolute; margin: 1px; padding: 0; right: 10px;" /> <asp:ImageButton runat="server" ID="btnDownloadTransactions" Style="position: absolute; margin: 1px; padding: 0; right: 170px;" /> </TitlebarTemplate> <ContentTemplate> <br /> <br /> <br /> Content <br /> <br /> </ContentTemplate> </telerik:RadDock> </telerik:RadDockZone> </form></body></html>Attached is result01.gif showing the result in Firefox.
Could you send us a live url or a simple project where the problem exists, so we will be able to investigate it further?
Best wishes,
Bojo
the Telerik team
Do you want to have your say when we set our development plans?
Do you want to know when a feature you care about is added or when a bug fixed?
Explore the
Telerik Public Issue Tracking
system and vote to affect the priority of the items