views:

3954

answers:

7

It seems like I heard/read somewhere that DIVs inside of TDs was a no-no. Not that it won't work, just something about them not being really compatible based on their display type. Can't find any evidence to back up my hunch, so I may be totally wrong.

+14  A: 

No. Not necessarily.

If you need to place a DIV within a TD, be sure you're using the TD properly. If you don't care about tabular-data, and semantics, then you ultimately won't care about DIVs in TDs. I don't think there's a problem though - if you have to do it, you're fine.

Jonathan Sampson
I've always wanted to answer a question with a yes or a no ;)
Jani Hartikainen
@Jani - you can :) http://stackoverflow.com/questions/936892/coding-party-tricks/936964#936964
John Rasch
+1 - really wanted to answer with something wittier, but failed.
karim79
Even though this got more upvotes I think that Guffa brought up a point that isn't addressed here (and may be the source of my hunch)
jcollum
+3  A: 

What you probably heard was that tables are a no-no for layout, especially when tables are nested inside of tables. Divs are better for layout, for a number of reasons. But tables are perfectly OK for tabular data.

Haven't heard the Divs inside of Tables thing before, except that it implies that tables are being used for layout.

Robert Harvey
+7  A: 

A table-cell can legitimately contain block-level elements so it's not, inherently, a faux-pas. Browser implentation, of course, leaves this a speculative-theoretical position. It may cause layout problems and bugs.

Though as tables were used for layout -and sometimes still are- I imagine that most browsers will render the content properly. Even IE.

David Thomas
I suspect browser implementation is where I got my "wait, that's a bad idea" from.
jcollum
+1  A: 

It breaks semantics, that's all. It works fine, but there may be screen readers or something down the road that won't enjoy processing your HTML if you "break semantics".

Greg
@Greg, why does it break semantics? A div is simply a block-level division, or sub-division, of the page content. As such it's not essentially and irrevocably anti-semantic to place them within a table cell.
David Thomas
I tried to write several responses to you that justified my answer, but I kept coming down to personal opinion. :/ I guess my best response would be that whatever is in your cell can probably be better represented by another HTML tag. If you are truly dividing your cells into components, then you probably shouldn't be using a table to begin with, you should be styling a series of DIVs for your layout. Not sure why I can't put this into better words...chalk it up to IMHO, I suppose.
Greg
Hmm, do you mean that a TD is semantically the same thing as a DIV so why have two of them in a row?
jcollum
Yea I don't really agree that `<div>` elements offer or alter any semantic information at all. They have about the same semantic information as a blank space, only in a different direction.
TokenMacGuy
@Greg; I agree wholeheartedly with your sentiment, it *feels* wrong. And also I agree, if sub-divisions are required in a table-cell, that the content's -probably- being presented inappropriately. But it's still not *inherently* technically, or ethically, or semantically wrong. I know I'd feel dirty though... =]
David Thomas
@jcollum: No, I wouldn't say they are semantically the same. TD is definitely a cell in a table; it's a part of a known structure: a table has rows, a row has cells, cells contain data. DIV is just a container ... it can represent anything at anytime anywhere in the document - you have to apply style to it to get any semantics from it in terms of purpose in the markup.
Greg
A DIV is semantically meaningless, so I don't see how it could ever be incorrect.
Rex M
You won't find anyone more zealously pro-semantics than myself here, and a div inside a td absolutely does not inherently break any semantics, especially considering the semantic meaning of a div is *only* a logical division. It might well be completely redundant tag bloat in the specific, but it's fine in the abstract.
annakata
I feel that if you're using a `DIV` to divide content in a table cell, then you should be using extra table cells. Think about it like a database - each cell should have one piece of data.
DisgruntledGoat
A: 

To those people who would argue that tables should only be used for tabular data then it would be a no-no, but I have never had a problem with them.

Chris Mullins
+1  A: 

After checking the XHTML DTD I discovered that a <TD>-element is allowed to contain block elements like headings, lists and also <DIV>-elements. Thus, using a <DIV>-element inside a <TD>-element does not violate the XHTML standard. I'm pretty sure that other moderne variations of HTML has an equivalent content model for the <TD>-element.

Martin Liversage
+4  A: 

Using a div instide a td is not worse than any other way of using tables for layout. (Some people never use tables for layout, and I'm one of them.)

If you use a div in a td you will however get in a situation where it might be hard to predict how the elements will be sized. The default for a div is to determine it's width from it's parent, and the default for a table cell is to determine it's size depending on the size of it's content.

The rules for how a div should be sized is well defined in the standards, but the rules for how a td should be sized is not as well defined, so different browsers use slightly different algorithms.

Guffa
I suspect this is where my hunch came from. Thanks for clearing it up.
jcollum