Is using tables for layout bad karma? [duplicate]

This question already has answers here: Closed 11 years ago.

Possible Duplicate:

Why not use tables for layout in HTML?

I've always heard that using tables for layout was a BIG NO NO. To my understanding, you were supposed to use div's and span's for layout.

I've been working on a site recently that has a lot of information that is directly side-by-side. Div's take up an entire line. Setting them to do otherwise in the CSS is annoying. If it is this开发者_JAVA技巧 hard to support, are div's actually made for this?

Tables just seem like the overall solution for it all. What are the downsides of using Tables vs. div's and span's?

For instance, I used tables to layout this here:

---

Tables should be used to display tabulair data. For other cases, use div's and span's.

"has a lot of information that is directly side-by-side." sounds like tabulair data. I won't punish you for using tables in this case. EDIT
You've just edited your answer, and included your lay-out. Don't use tables!

For readability, your code should look like this:

<div class="cart">
    <div class="price"></div>
    <div class="quantity"></div>
    <div class="pay"></div>
</div>

Compare that lay-out to:
    <table>...<tr><td></td>....</table>

When one views the source of the first lay-out, he can get meaningful information from it. When viewing the source of the second option, on the other hand...

EDIT2 - Layout example

When creating a dynamic webshop, you should also take users who have disabled JavaScript into account. See Fiddle: http://jsfiddle.net/GRgkz/1/

I have created one <form> container element, in case the user has disabled JavaScript. Inside the form, I've added the lay-out. See the fiddle for the application logic.

---

Tables should and always be used for tabular data, hence the name table.

For layouts which are not tabular, you should use <div> tags, occasionally <span> tags, newer html5 tags such as <header> <article> <nav>, other tags like <dd> <dt> <dl> <ul> <li> Using a combination of them, you will be able to create many different layouts.

Setting them to do otherwise in the CSS is annoying

No, this is completely wrong. It is only "annoying" if you do not know what you are doing. If you do not know what you are doing, then read up on html/css and how to properly use it. You are not going to learn everything quickly, and only through practice will you become a "guru" in the "art" of building cross browser websites.

Don't be lazy though, do it properly. External CSS files which style your html.

Edit

Looking at the HTML which you have added to your question, you certainly should NOT be using tables for this markup. This is a simple layout which can easily be achieved with <div> tags and some css markup.

---

Smashing Magazine has a wonderful article about this :

http://coding.smashingmagazine.com/2009/04/08/from-table-hell-to-div-hell/