View Full Version : Use of tables in website

10-02-2007, 10:30 PM
Hi I am building a website at http://www.techlimelight.com/beta and am using tables quite heavily alongside CSS. Is this considered bad coding practice? Should I avoid tables altogether and purely use CSS?

Thanks for your time,

10-02-2007, 10:44 PM
Tables used for layout is considered poor design. Tables used to display tabular data, however, is not.

You should strive for semantic coding for your layout and use tables where you need to display appropriate data.

10-02-2007, 10:46 PM
Yes it is considered bad coding practice. Your html tags should have meaning as to what content they hold. Tables should be used for tabular data. List items should be put into list elements. Paragraphs into <p> elements etc. The tags are a description of the data they hold and have no relation to the layout of the page.

10-03-2007, 03:07 AM
Why tables for layout is stupid: (http://www.hotdesign.com/seybold)
(got from Aero's sig ;))

10-03-2007, 05:58 AM
Thanks so much everyone! Wow this forum is fast... I posted in another forum and have yet to get a response after a couple of days. I have begun transitioning from table layout to CSS, however I am running into a problem. As you can see at http://www.techlimelight.com/beta the login form in the top right works as intended in Firefox but is misalined in IE. The password field is also slightly misaligned in Safari.

What am I doing wrong? Is there any way to fix this/avoid this in the future. What is the best way to make sure the design looks the same across browsers? Particularly in IE, Firefox, and Safari?

I've attached the stylesheet.

Thanks in advance,

10-03-2007, 06:31 AM
Ok well I seemed to have fixed the problem. I'm not sure if this is the correct way to go about it, or why it even fixed the problem though. Instead of applying a style to the login_rule.jpg image (the ruler below "Login" and "Forgot Password") via the <img id="">, I wrapped the <img> in a <div> tag and assigned the id to the div element. That seemed to fix the problem in IE. Still don't know why though. I have updated the website to reflect the result.


10-03-2007, 06:33 AM
Does the style of coding look decent? Is what I am doing considered good practice both in the stylesheet and in the code itself? I just want to make sure I get this all sorted out before I convert the rest of my code. Any suggestions to avoid browser conflicts, coding style suggestions, etc?

Thanks again,

10-03-2007, 07:57 AM
You know that you have the HTML right when the tags describe what they contain and you have the minimum number of div and span tags that are required to lay the page out correctly.

If wrapping an image in a div and styling the div fixed a problem then adding display:block to the styles for the image would probably fix it without needing the div.

10-03-2007, 06:51 PM
Just to drive the point home, I am currently working on an existing site that has used tables for layout. When you have tables nested in tables nested in tables nested in tables (yes, I have pages that have 4 levels of tables), it is a headache to troubleshoot layout and design. CSS and divs are much more friendly to problem solving and making future changes.

Stick with the CSS. It will be better off in the long run!