Saturday, March 24, 2012

TabContainer - Tabs look weird!

Why is the default style looking weird like this. I did not change anything from the original settings so why is this happening and how can I correct it?

hum... I only have this problem with IE6 and 7, it's looks fine with Mozilla.

<%@. Page Language="vb" AutoEventWireup="false" EnableEventValidation="false" CodeBehind="test1.aspx.vb" Inherits="ClientBase.test1" %><%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %><html xmlns="http://www.w3.org/1999/xhtml" ><head runat="server"> <title>Untitled Page</title> <link href="Styles.css" type="text/css" rel="stylesheet"></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <cc1:TabContainer ID="TabContainer1" runat="server"> <cc1:TabPanel HeaderText="Tab 1" runat="server"> <ContentTemplate> blabla 1 </ContentTemplate> </cc1:TabPanel> <cc1:TabPanel HeaderText="Tab 2" runat="server"> <ContentTemplate> blabla 2 </ContentTemplate> </cc1:TabPanel> <cc1:TabPanel HeaderText="Tab 3" runat="server"> <ContentTemplate> blabla 3 </ContentTemplate> </cc1:TabPanel> </cc1:TabContainer> </form></body></html>

I am sure that someone must have experienced this before. Any sugestions would be great.

Thanks


Yes, I have the EXACT same problem. When I have the page all by itself, it looks as expected. But when I put the page in a template, it gets those same strange white boxes that cut the tab text in 1/2. If you find a solution, please post it here for the rest of us!


A little more research brings me to this thread:http://forums.asp.net/p/1069041/1554327.aspx#1554327 - which discusses in detail the exact problem. It has to do with tabs in Master pages.


Thanks for your reply, this lead me toward the answer needed. It seems that because Quirks Mode is not supported by Ajax Tabs (not sur what quirks mode is exactly) that the page containning the tabs need the following DocType definition in order for it to show properly.

<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

No comments:

Post a Comment