Closed Issue: TabContainer forces inline style 'height=100%' [27212]

Hi,

Apologies if this is a duplicate post; I *did* search...

My company has upgraded to the June 2012 version of AjaxControlToolkit (we were previously on an ancient version). We are now having styling issues with the Tab.

The culprit seems to be the RenderContents() method of TabContainer.cs, adding an inline style of "height: 100%" to the ajax__tab_body in the new version, where previously it did not.

*** *** ***

First off, this is the snippet of ASPX code that we are using. Note the complete lack of "Height=" attribute (on purpose - all styling is done in CSS).

[code]
<act:TabContainer ID="tabContainer" CssClass="mainTab" runat="server" ActiveTabIndex="0">

<act:TabPanel ID="tabAction" runat="server">
<ContentTemplate>
-snip-
</ContentTemplate>
</act:TabPanel>

</act:TabContainer>
[/code]

*** *** ***

TabContainer.cs from changeset a864b0ed5a96 dated 11/15/2011 11:52 AM has the following code, where it will only output an inline "height: " style, if the programmer specified one:

[code]
if (_tabStripPlacement == TabStripPlacement.Top) {
RenderHeader(writer);
}

if (!Height.IsEmpty)
writer.AddStyleAttribute(HtmlTextWriterStyle.Height, Height.ToString());

writer.AddAttribute(HtmlTextWriterAttribute.Id, ClientID + "_body");
[/code]

*** *** ***

TabContainer.cs from changeset 9ffbcddf17ff dated 11/15/2011 12:21 PM has the following code, where it will ALWAYS output an inline "height: " style: either the programmer's , or a hard-coded "100%":

[code]
if (_tabStripPlacement == TabStripPlacement.Top
|| _tabStripPlacement == TabStripPlacement.TopRight
|| (_tabStripPlacement == TabStripPlacement.Bottom && _useVerticalStripPlacement)
|| (_tabStripPlacement == TabStripPlacement.BottomRight && _useVerticalStripPlacement)
)
RenderHeader(writer);

if (!Height.IsEmpty)
writer.AddStyleAttribute(HtmlTextWriterStyle.Height, Height.ToString());
else
writer.AddStyleAttribute(HtmlTextWriterStyle.Height, "100%");

writer.AddAttribute(HtmlTextWriterAttribute.Id, ClientID + "_body");
[/code]

*** *** ***

The default of "100%" FAILS TO TAKE INTO ACCOUNT THE HEIGHT OF ajax__tab_header , set in CSS to 21px.

The fix (to me) is obvious ... if a programmer actually wants a height of 100%, they can code it, and the "if not empty" will output it. In our case, we left it empty on purpose, and it used to work ... but no longer.

Perhaps the default of 100% is desirable for the new TabStripPlacement's that were added.

*** *** ***

Could you please review and advise?

Thanks,
Ted Taylor

Comments: AJAX Control Toolkit was moved to GitHub: https://github.com/DevExpress/AjaxControlToolkit The fix for this issue is available with the v16.1 release: https://github.com/DevExpress/AjaxControlToolkit/releases/tag/16.1.0