Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

On our site we have tables containing data. We like the column widths we get with a normal table, but we like the border-bottom of tds to stretch the entire width of the page like we get with CSS: table { width:100% }, as can be seen on a demo table widths page.

Is it possible to achieve the same column widths as with a normal (non-width-100%) table in a table where the border-bottom stretches the entire width?

Btw, is there a better way (tm) of showing HTML snippets than linking to an external page? I can show just source, but having HTML rendered too is so illustrative.

We need a solution that works in at least IE6-8 + FF.

share|improve this question
add comment

2 Answers

Adding #tableB td { float: left; } will give you the desired effect in current browsers (IE8+, Chrome, Firefox etc). However this does not work in IE7.

You can see an approach offered for dealing with floating td's in conjunction with IE7: http://stackoverflow.com/questions/1018125/ie7-how-to-make-td-float.

Note that the above suggested workaround uses invalid markup to achieve what I believe you're looking to do.

share|improve this answer
    
Thanks. Yeah I need to support IE6-8 and FF. So also IE7. And the IE7 workaround fixes the column widths, and then we're nowhere... But thanks for the suggestion. I'll edit the description to mention the cross-browser requirement. –  Peter V. Mørch Dec 20 '10 at 23:29
add comment

If you set td { white-space: nowrap } the lines 'Foo Bar' and 'Hello World' will stay intact. Is this what you're after?

share|improve this answer
    
That doesn't work if the contents of a TD are very long. A "normal" table starts wrapping at some point, whereas td { white-space: nowrap } will never wrap. So no that won't work for us as some td s are very long. What I'm after is the same behaviour as "normal" tables/cells. That wrap under the same conditions. –  Peter V. Mørch Dec 13 '10 at 10:06
    
Hmm, tough one. I wonder at what exact point a "normal" table starts wrapping, it must be in the specifications somewhere. Maybe you should ask this over at StackOverflow.com –  Stephan Muller Dec 13 '10 at 10:30
    
Yeah, I was wondering that. Stackoverflow is for "Q&A for professional and enthusiast programmers" and Webmasters is for "Q&A for pro webmasters". I assumed HTML/CSS questions were for Webmasters. But I'll post on Stackoverflow instead. Thanks, Litso! –  Peter V. Mørch Dec 13 '10 at 12:20
    
new question at stackoverflow –  Peter V. Mørch Dec 13 '10 at 23:36
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.