When I do web layout, I am using html <table>. However, I read on the internet that html tables should only be used in data and should use <div> or <span> when doing layout. I searched on the internet and found about display: table . I read about it and in my own understanding (I don’t know if I understood it right) it is the same as html <table>. I find it easier to use html <table> because its way much simpler. I don’t have to worry about positioning the <div> because most of the time it goes to the spot where I did not intend to.
My question is: what are the pros and cons or disadvantages of using html <table> in layouting?
There’s not a whole lot of advantages to using table markup for page layout other than for someone that doesn’t want to learn proper HTML/CSS and/or is using some sort of WYSIWYG editor.
You definitely want to use tables for tabular data, however, as there are a lot of good accessibility reasons.
The advantages of CSS for page layout (over tables) is:
The css display property of ‘table’ allows your your CSS to act more like a traditional table. This gives you the benefits of CSS, but lets you use your older table logic.
If you are well versed in CSS, about the only time you’d really want to leverage display: table is when you run into situations where you want to handle vertical centering of content…something that CSS in general seems to fail at. Do note that display: table, like a lot of CSS, does not work in older versions of IE.