What is meta? ×
Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 127 Stack Exchange communities.

I remember looking at some SO source markup months ago, and it was basically <div> heaven. The pure CSS zealots would've loved it. But today I look and see...

<DIV id="question" class="">
    <TABLE>
    <TBODY><TR>
    <TD class="votecell">

<DIV class="vote">
    <INPUT type="hidden" value="288968">
    <IMG class="vote-up" src="./so_files/vote-arrow-up.png" width="40" height="25" alt="vote up" title="This question is useful and clear (click again to undo)">
    <SPAN class="vote-count-post">6</SPAN>
    <IMG class="vote-down" src="./so_files/vote-arrow-down.png" width="40" height="25" alt="vote down" title="This question is unclear or not useful (click again to undo)">
    <BR>
    <IMG class="vote-favorite" src="./so_files/vote-favorite-off.png" width="32" height="31" alt="star" title="This is a favorite question (click again to undo)">
    <DIV class="favoritecount"><B>2<BR></B></DIV>
</DIV>
    </TD>
    <TD>
        <DIV>          
            <DIV class="post-text">

Now this doesn't bother me (I'm a pragmatist) but I'm curious... is this something new? Why the change? Did you have issues using floats for this? If so, what?

Edit: Hey it gets better. The tables are nested. Now watch some heads explode. :)

share|improve this question
13  
ugh, SO really should do better... –  bananakata Jul 7 '09 at 11:04
    
I'd like to see an response on this as there are implications for both methods. I do have to agree with annakata though. It's a Brave New Web now that even Microsoft is trying to support standards. –  Rob Allen Jul 7 '09 at 13:13
10  
I'd like to ask a related, but far more important question: why doesn't SO use 1-pixel transparent GIFs for layout? And where are the animated flames and red script text on a black background? –  Hilarious Comedy Pesto Jul 7 '09 at 16:28
4  
    
meh. Rather more alarmingly, it fails validation for what appears to be mismatched tags (and a missing alt) validator.w3.org/… –  Macha Aug 2 '09 at 23:27
    
@Macha: that whole business of requiring alt was quite misguided; better no alt than a bad alt: UAs can do better than a bad alt, but they don't know how to tell if an alt is bad. Of course, it is important to use alt="" for images that convey no additional information, or the page will be littered with useless junk as rendered by non-graphical UAs, such as links or screen readers. (Or, heck, even by graphical UAs with images turned off!) –  SamB May 25 '11 at 17:45
add comment

8 Answers

I hope they did it just to make some heads explode, honestly. The holy war between tables and divs is one of the most annoying arguments in all of IT.

share|improve this answer
5  
To me, it's the hipster version of emacs vs vi. Mainly because I immediately associate web design with hipsters. –  Eric Jul 7 '09 at 11:28
    
Hipsters? What is this, the 1950s? –  nb69307 Jul 7 '09 at 11:33
1  
Punks vs. Mods! Cafe racing is making a comeback! –  TheTXI Jul 7 '09 at 11:36
    
In the UK at least, it was Mods v Rockers. –  nb69307 Jul 7 '09 at 11:39
    
Neil: Thank you for correcting me. You are right but I couldn't quite remember the name of the Rockers :) –  TheTXI Jul 7 '09 at 11:40
    
Mods & Rockers - 1950s and early 60s. Punks - late 70s and early 80s –  ChrisF Jul 7 '09 at 11:43
5  
It's nothing like emacs/vi or mods/rockers - there's a definitvely correct position, and there's a pragmatic (imho lazy) opinion that a developer does not need to meet that. –  bananakata Jul 7 '09 at 11:55
9  
This isn't butter-side-up versus butter-side-down. It's Standard-compliant versus easy-mode/status quo. –  Rob Allen Jul 7 '09 at 13:16
3  
the holy war rages on –  TheTXI Jul 7 '09 at 14:32
2  
Rob Allen> Tables are part of the html standard aren't they? It might not be considered good semantic markup, but it is standards compliant –  U62 Jul 7 '09 at 15:36
5  
@U62 - Yes, tables are allowed in standard based mark-up, but not for layout purposes. It's harsh on mobile and non-graphical browsers and the default settings for tables prevent them from displaying anything on-screen until all of their data is ready which makes page refreshes feel clunkier. –  Rob Allen Jul 7 '09 at 15:44
3  
@Rob Allen: For when you really need to answer that last SO question on your iPhone during the commute home from work? –  XMLbog Jul 7 '09 at 16:25
1  
@Welbog - My Blackberry actually. I'd like an iPhone but can't make the switch to AT&T yet. –  Rob Allen Jul 7 '09 at 18:09
    
I find it ironic that every single up vote I have ever received on this answer has been when I am at my rep limit. –  TheTXI Jul 8 '09 at 3:57
1  
@annakata You know, there is a definitively correct position on the vi/emacs debate too. :wq –  user3788 Jul 8 '09 at 21:26
show 1 more comment

As someone who has struggled mightily to get divs to behave the way I want them to, I give props to the SO UI designers for having the balls to use tables.

share|improve this answer
3  
Seriously? It's admitting defeat, no matter how you cut it, and I have a hard time "giving props" to someone for intellectual cowardice/laziness, which is how I see it. But then, I'm a zealot. –  bananakata Jul 7 '09 at 15:37
19  
@annakata: Give me a widely implemented standard that allows me to easily align screen elements horizontally and vertically easily without having to sacrifice dynamic widths and will use it. Until that standard comes, stop asking developers to not use the best tools available to them. –  XMLbog Jul 7 '09 at 16:29
1  
I was about to say something really bad about annakata, but the portal avatar stopped me. –  Won't Jul 7 '09 at 17:02
1  
I think there's more interesting and some might say important issues in the world to be a zealot about than HTML tables. Unless of course you are actually blind/visually impaired and your screen reader doesn't like it. –  Chris S Jul 8 '09 at 13:48
add comment

Use of tables depends on how far you want to take the "tabular data" notion. The table on this page separates the upvotes from the writter answer. That's tabular data in my eyes. You could just as easily display a boring table like this:

VOTES      | ANSWER
=================================
15         | I hate tables
---------------------------------
-50        | I love tables
---------------------------------

Stack Overflow just presents it nicely :)

share|improve this answer
add comment

For those interested to see where the tables are. Check out this image. It's the same grid as with the questions.

share|improve this answer
add comment

While I prefer to use CSS layout where possible, but try to be pragmatic about it.

The one real bugbear for which I almost always use tables is laying out forms. To do a simple form like:

Label    Input
Label    Input
Label    Input
         Submit

Is just hellish with CSS. You have to know the widths each column will need, and stick in work-arounds for different browsers. If you change the text in a label, then you have to go back and revisit the CSS to get the width right again, and that's assuming everyone uses the same size/font you do. And you have to go through this for every form. Total PITA.

Plonking it into a table, it just lays out the way you want, and the columns size appropriately for everything to fit. A lot less headaches.

share|improve this answer
1  
Forms are tabular data. Labels are the 'headings', while the fields are the 'data'. –  DisgruntledGoat Jul 25 '09 at 20:25
add comment

I much prefer sticking to a semantic layout where possible. That means using the div tag sparingly as well. It has a specific purpose (creating a logical division) just like table.

That said, there's nothing wrong with using a table for layout here and there, as long it's done very sparingly, isn't your default layout tool, and the overall structure of the site is apparent from the semantics.

share|improve this answer
5  
I disagree. There is something wrong with using tables for layouts - always, without exception. The only thing I would add is that I wouldn't get worked up over the way SO used them. Minimal is far better than what we see on the web elsewhere. –  Jonathan Sampson Jul 7 '09 at 14:30
    
Unless you're displaying tabular data :) –  Chris S Jul 8 '09 at 13:49
add comment

I couldn't agree with you more. Tables are inherently worse - an HTML parser wading through nested DIV tags and cascading styles with different per-browser hacks is obviously way better than wading through nested TD tags. /troll, ducks

share|improve this answer
add comment

They should use whatever works for them, I suppose. Maybe they realised that with pure divs, maintaining and adding things were a nightmare :)

Maybe it also means, there is not going to be a mobile version of SO any time soon?

share|improve this answer
3  
Or may be there are no web designers on the core SO team. /hides –  perbert Jul 28 '09 at 16:53
add comment

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .