Deprecated: Function set_magic_quotes_runtime() is deprecated in /home4/mfoster/public_html/cb/forums/include/common.php on line 62

Warning: Cannot modify header information - headers already sent by (output started at /home4/mfoster/public_html/cb/forums/include/common.php:62) in /home4/mfoster/public_html/cb/forums/header.php on line 31

Warning: Cannot modify header information - headers already sent by (output started at /home4/mfoster/public_html/cb/forums/include/common.php:62) in /home4/mfoster/public_html/cb/forums/header.php on line 32

Warning: Cannot modify header information - headers already sent by (output started at /home4/mfoster/public_html/cb/forums/include/common.php:62) in /home4/mfoster/public_html/cb/forums/header.php on line 33

Warning: Cannot modify header information - headers already sent by (output started at /home4/mfoster/public_html/cb/forums/include/common.php:62) in /home4/mfoster/public_html/cb/forums/header.php on line 34
Cross-Browser.com / [xTableHeaderFixed] bug when using multiple rows in thead in IE7

Cross-Browser.com

X Library Forums

You are not logged in.

Announcement

New user registration is currently disabled.

  • Index
  •  » X Library
  •  » [xTableHeaderFixed] bug when using multiple rows in thead in IE7

#1 January 15, 2010 11:44:33 am

theseeker
Member
Registered: December 11, 2009
Posts: 24

[xTableHeaderFixed] bug when using multiple rows in thead in IE7

I'm having trouble with xTableHeaderFixed in IE7 when using multiple rows in the table header.

Here's an example of the code that will cause the problem:

  <thead>
    <tr>
      <th align="center" class="captionrow1" colspan="14"><asp:Literal ID="captionHeader1" runat="server" /></th>     
    </tr>
    <tr>
      <th align="center" class="captionrow2" colspan="14"><asp:Literal ID="captionHeader2" runat="server" /></th>     
    </tr>
    <tr>
      <th align="left" colspan="2">Item <span class="smaller">(numbers link to glossary)</span></th>     
      <th align="center"><asp:Literal ID="YR1Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR2Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR3Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR4Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR5Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR6Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR7Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR8Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR9Header" runat="server" /></th>   
      <th align="center"><asp:Literal ID="YR10Header" runat="server" /></th>       
    </tr>
  </thead>

Here's how this code renders when the page is loaded:

http://www.dmi.illinois.edu/temp/correct_thead.jpg

Here's what happens (only in IE7) when the page is scrolled:

http://www.dmi.illinois.edu/temp/scroll_Ie7_thead.jpg

There is a fairly painless workaround. Just change the cells inside all of the rows except the last one listed from <th> to <td> like this:

  <thead>
    <tr>
      <td align="center" class="captionrow1" colspan="14"><asp:Literal ID="captionHeader1" runat="server" /></td>     
    </tr>
    <tr>
      <td align="center" class="captionrow2" colspan="14"><asp:Literal ID="captionHeader2" runat="server" /></td>     
    </tr>
    <tr>
      <th align="left" colspan="2">Item <span class="smaller">(numbers link to glossary)</span></th>     
      <th align="center"><asp:Literal ID="YR1Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR2Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR3Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR4Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR5Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR6Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR7Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR8Header" runat="server" /></th>
      <th align="center"><asp:Literal ID="YR9Header" runat="server" /></th>   
      <th align="center"><asp:Literal ID="YR10Header" runat="server" /></th>       
    </tr>
  </thead>

Just thought I'd throw that out there in case any others were having issues.

Offline

 

#2 January 16, 2010 12:23:14 pm

MikeFoster
Administrator
From: Alabama, USA
Registered: April 27, 2007
Posts: 874
Website

Re: [xTableHeaderFixed] bug when using multiple rows in thead in IE7

Yes, only the THs in the TBODY copy are assigned the widths of their corresponding THs from the TBODY original. Excellent tip. Thanks very much!

Offline

 

#3 January 20, 2010 10:22:14 am

MikeFoster
Administrator
From: Alabama, USA
Registered: April 27, 2007
Posts: 874
Website

Re: [xTableHeaderFixed] bug when using multiple rows in thead in IE7

Update:

Because of recent improvements, in demos 3 and 6, which have multiple rows with colspan'd cells, I'm now using only THs - no TDs, and it works just as well smile

Offline

 

#4 October 26, 2010 5:41:13 pm

theseeker
Member
Registered: December 11, 2009
Posts: 24

Re: [xTableHeaderFixed] bug when using multiple rows in thead in IE7

The improvements you made to the code for multiple rows with colspan'd cells works great... except in IE7. Your demos work fine with IE7, but my site doesn't. Here's a screenshot:

http://www.dmi.illinois.edu/temp/ie7_mult_row_colspan.jpg

I've gone back to using TD's in the THEAD instead of TH's, and that workaround continues to work just fine. My table (and related code) is fairly complex, so it's very possible it's just something I'm doing wrong.

Anyway, it's not that big of a deal since there's a very easy workaround, I just thought I would pass on that sometimes TD's are still necessary in the THEAD. Thanks.

Offline

 

#5 October 26, 2010 9:39:45 pm

MikeFoster
Administrator
From: Alabama, USA
Registered: April 27, 2007
Posts: 874
Website

Re: [xTableHeaderFixed] bug when using multiple rows in thead in IE7

Hi theseeker, it's great to hear from you again!

Thanks very much for the tip. This object is indeed very dependent on the specific application. There isn't really one "best" way to use it.

Thanks again! smile

Offline

 
  • Index
  •  » X Library
  •  » [xTableHeaderFixed] bug when using multiple rows in thead in IE7

Board footer

Powered by PunBB 1.2.15
Copyright © 2002–2005 Rickard Andersson

Expand Restore Select Format Eval Load