2 Replies - 130 Views - Last Post: 07 October 2014 - 08:09 PM

#1 trevster344  Icon User is offline

  • The Peasant
  • member icon

Reputation: 224
  • View blog
  • Posts: 1,507
  • Joined: 16-March 11

Table Data Overflow layout issue

Posted 07 October 2014 - 03:12 PM

Is there anyway to get the outer most table columns and the innermost table columns to line up right?

http://jsfiddle.net/1nx2aqhh/2/

I'm using this technique to achieve an overflow ability for the content inside the table without allowing the scrollbar to hide my header columns. Thanks for any help.
Is This A Good Question/Topic? 0
  • +

Replies To: Table Data Overflow layout issue

#2 andrewsw  Icon User is online

  • It's just been revoked!
  • member icon

Reputation: 3624
  • View blog
  • Posts: 12,527
  • Joined: 12-December 12

Re: Table Data Overflow layout issue

Posted 07 October 2014 - 05:09 PM

You will find it very difficult to keep the columns aligned, especially cross-browser. You have two used two independent/nested tables; even if you use fixed-widths you have to take into account the width of the scrollbar, which may be different in different browsers.

There is an example here that achieves a fixed header.
Was This Post Helpful? 1
  • +
  • -

#3 trevster344  Icon User is offline

  • The Peasant
  • member icon

Reputation: 224
  • View blog
  • Posts: 1,507
  • Joined: 16-March 11

Re: Table Data Overflow layout issue

Posted 07 October 2014 - 08:09 PM

Thanks andrew. I've found numerous resources for this and they were all just like mine. I did however find two resources from two other gentlemen who came up with a seamless pure css method. I'm testing it now, and will report back with the complete answer and a link when I solve it.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1