Forum Moderators: not2easy
This may seem like a silly question. I have been browsing the forum, I came across this statement used when referring to a new site design 'Glad they haven't jumped on the CSS band wagon and stuck to table layout'.
I use table layout with CSS, however this statement would imply that there is a difference between CSS and table layout methods. I used to use layers or div tags, but changed to tables when I started to learn about CSS. I am getting the feeling that I did this the wrong way round. That it would be better to use CSS with div tags.
What are the differences? are there any? and what are the pro and cons of each method?
Generally when people speak about table based layouts or CSS based layouts, they are referring to which they use to achieve the structure of their page. Many people use tables to create their page structure, and use CSS for all typographical and colour styling etc.
CSS layout generally refers to a page structure based on CSS-P (aka CSS-2), or one using div's.
Briefly, the pro's of using a CSS based layout is:
There are more, but hopefully you get the drift, and I'm sure other people will post more.
Table based layouts are much easier to do (for the most part) and you know that it will look similar in all browsers, without having to worry about compliance. However, it's important to rememeber that strictly tables should only be used for tabular data.
Check out this page [bluerobot.com] for a nice way of centering a div.
To align the text to the left within this, just add text-align: left into the CSS.
It's true that there are problems with getting many CSS layouts compatible with NS4.x, but it's not impossible. I for one just make sure that my CSS degrades gracefully for NN4.x, I don't support it any more, unless the client specifically asks for it or a large chunk of their users browse with it. Looking at log files, it's quietly dying away.
Wicked :) But remember that "A negative value is allowed, but there may be implementation-specific limits."
> To align the text to the left within this, just add text-align: left into the CSS.
Yes, I took the liberty of posting in another thread [webmasterworld.com].
> It's true that there are problems with getting many CSS layouts compatible with NS4.x, but it's not impossible. I for one just make sure that my CSS degrades gracefully for NN4.x, I don't support it any more, unless the client specifically asks for it or a large chunk of their users browse with it. Looking at log files, it's quietly dying away.
I can hardly wait. Some of my images are jumping around when I reload on NS4. That is: when I press the reload button - without altering my HTML - a centered image suddenly floats to the right and a right-aligned image jumps to the left side! And the next time I reload they jump back.
I see the benefit of div tags (one of the reason I stopped using them was the NS4 issue however as Hagstrom said it seems to be dying slowly), however it is not immediately apparent to me as to how CSS enhances them.
Could someone give an example of a div layout with CSS formatting.
Beautiful - but they are using position-right, which is unsupported on version 4 browsers.
And to make it work with IE5 they are using a hack.
On their main page they say "To Hell with Bad Browsers" and while I don't necessarily disagree, I would like to point out that the old "chunky" tables actually support NS4.
So to answer Red_Eye's original question: Do you want "beautiful" or "solid"?
Real World Style - css layouts, tips, tricks, and techniques
[realworldstyle.com...]
There is some emphasis for NN 4 browsers and using CSS at this web site.
holly