Table vs div

I want to put 8-10 thumbnails on the home page. As I am not in favour of tables, I want to employ divs in placing those thumbnails and some little descriptions right underneath of them. My question is that which method do you masters think I should use - tables or divs? I heard that tables may slow down the download speed so I am a bit confused. Which method would you recommend and why?

Many thanks

When deciding what element to encapsulate your content with, you’re actually defining the intended content with html’s vocabulary.

I would not use either (div/table).

If each thumbnail description shares a direct relationship with the image, then a definition list would be the right tool for the job.

Since styling definition lists in this format can cause some authors abnormalities, most utilize unordered lists (if the list items have no particular defined order).

Never thought of definition lists. Do you know any web site of which home page has been prepared with this method so I can take a look?

That post is old, but it gives you more of a POC how you could go about styling the css.

From no more than your description, I’d go with a list, and display the list items as inline-block to accommodate the captions. See my inline-block gallery demo. Perhaps you can adapt it to your needs.



Thanks for the advise guys, appreciated…

I would definitely not use tables. For a start, it’s just incorrect, plain and simple. For a second, it makes it harder to offer a flexible design.

I know others have suggested using a <dl>, but my own recommendation would be a <div>. This allows you to wrap the image and text in a single <a> element, which reduces markup and complexity. It might not be semantically perfect, but I don’t think it’s particularly wrong. You can then float the <div>s, which means that you will get the right number of items on each row to make best use of space - they will fill the width available then start a new row automatically.

You can see an example of this in action at


What do you exactly mean by that?

All I meant was that it may be technically more correct to use lists, or definition lists, to give the relationships between content items. That said, I’m perfectly happy with the system of <div>s that I’ve used, and I don’t think it is in any way wrong, and it’s one of those examples where missing out on the minutiae of the semantics and allowing <br>s allows streamlined and minimised HTML and CSS, and is a sacrifice that is well worth making.

divitis is of course just as bad as tableitis. Either one means you are not writing semantically correct HTML.

Thank you guys for sharing your thoughts with me, appreciated.