Am I the only one who hates CSS layouts?

Paramount

Paramount

Paramount

Associate
Joined
6 Jul 2003
Posts
2,075
Not CSS as a whole obviously, the stuff you can do with it is great. I'm referring to using CSS with DIVs to build a layout..

I come from a time when layouts were done with tables. It was simple to get the page looking just how you liked it, it was quick, easy, and in conjunction with CSS you could get it looking spot on and no different to any of todays pages.

Specifically it was easy to read the page and understand what you're looking at (like looking at the Matrix!). I look at a page today and its a mess of divs. Even when you compare it with the style sheet it's still impossible to piece it together in your head.

Don't get me wrong, I can build a DIV layout with little problem now (maybe some frustration when the simplist of tasks requires the most complicated stlying) and appreciate the simplicity of the pages without table tags all over the place, but still think in a few ways it's a step backwards.

Anyone with me?
 
Afraid not mate.

I'm of the opinion that anyone who is well versed with CSS knows from experience that it's easier and quicker than tables.

Nearly everyone (and certainly the majority of successful studios) has switched for a reason and it's not because they wanted to use something more difficult and time consuming.
 
Paramount said:
[...] Anyone with me?
Click to expand...
Well, speaking as somebody else who came from Tableland, I can understand where you're coming from; table-based layout has a few benefits that CSS-P doesn't [vertical alignment, auto-stretching to name but two].

But as Tripnologist pointed out, CSS-P offers so many more benefits.

If you're missing the old days, just do a few full-feature email newsletters; HTML emails pretty much have to be laid out with tables for cross-client consistency, y'see. That'll knock any nostalgia out of you :D
 
I think it's mainly because the language is written to satisfy the browsers. We write in high level languages such as C#/Java that is readable to us and then a compiler translates it into something understandable by the target machine. With HTML/CSS we write it in such as way that the browser will understand it correctly because there is no compilation stage, it's executes as we read it.
 
rsatd said:
Thank you for being considerate to people who use text only email clients.
Click to expand...
Don't thank me - thank the people who don't use multipart MIME types to send text-only versions, or who don't even give subscribers the option.

But let's not drag this one off-topic so soon, eh?
 
Last edited:
I used to use tables, it was a godsend when I moved onto CSS.

Makes adding new pages and making changes so much easier!
 
picture4brj.png
 
I felt like that once. Then I saw the light. It takes a while to get your head round, but it's worth it in the end. I've completely re-designed a couple of sites recently without even touching the HTML. Try doing that with a table-based layout!

Tables are also a nightmare to read, compared to divs. They're also much neater if you're dynamically generating content, which means other developers can easily understand your code without the need to decipher code soup.
 
Personally, I think that it was badly thought out - if it's idea is to seperate design from content, it doesn't do a very good job of design. It's possible to create what you want, but you end up writing so many hacks it's like html4, ie4 and netscape all over again. For the point of view of easy changing of layouts etc, yes it works - but so does a quick php script.

I use it for the simple reason that I think accessibility is completely necessary - tables just won't do. But I wish to god they'd bring in features to make layouts easier, they just don't work properly - vertical equalisation and a little more intelligence in the automation of sizing being my two main points. Also, percentages working properly.

If I set two divs as being next to each other, one as 25% and the other as 75%, in a div which is 80% wide on a 1000px screen, I want a two-column page, one 200 pixels, the other 600 pixels and 100 pixels each side, both stretching to the height of the tallest.

What I do not want is an approximate jumble of 95% the width of the page, one about 220 pixels and the other 660, some funny gap in the middle, the borders overlapping and one far shorter than the other. That's not design, that's childsplay.
 
As Audigex says, it's leaps and bounds ahead of table-based design, but it certainly has its limitations. It's supposed to allow complete separation of presentation from structure, but in reality it doesn't; for all but the most trivial designs I invariably find myself having to introduce structurally/semantically unnecessary elements (usually divs, though sometimes spans, lis, etc.) in order to shoehorn the design into a CSS-workable form. Very frustrating.
 
Paramount said:
Not CSS as a whole obviously, the stuff you can do with it is great. I'm referring to using CSS with DIVs to build a layout..

I come from a time when layouts were done with tables. It was simple to get the page looking just how you liked it, it was quick, easy, and in conjunction with CSS you could get it looking spot on and no different to any of todays pages.

Specifically it was easy to read the page and understand what you're looking at (like looking at the Matrix!). I look at a page today and its a mess of divs. Even when you compare it with the style sheet it's still impossible to piece it together in your head.

Don't get me wrong, I can build a DIV layout with little problem now (maybe some frustration when the simplist of tasks requires the most complicated stlying) and appreciate the simplicity of the pages without table tags all over the place, but still think in a few ways it's a step backwards.

Anyone with me?
Click to expand...

Yes it was really easy remembering to put width=99% in the widest element of the table to make sure browsers didn't autosize your table. Very easy to slap an entire other table around the current table so that you could have a 1px border etc etc ;)

I come from those days to and table based layout is just hideous now. I have a friend who won't switch and sometimes have to look at his code and it's horrible.

Table layout is inaccessible, clunky, makes pages bloated. They're actually very inflexible when it comes to resizing unless you put spacer images everywhere to stop it resizing below the limit you wanted. Also Inquisitor it's easy (well once you know how) to do fixed width or resizable page layouts with CSS.

The main problem is browser functionality but you had that with Netscape 3, IE4/5 etc.
 
probedb said:
Also Inquisitor it's easy (well once you know how) to do fixed width or resizable page layouts with CSS.
Click to expand...

For the most part, I agree, but some things are more difficult than they need to be. Most designs that depart from the simple document-style page structure require at least some markup-level hacking to become doable with CSS. An example is when you want a footer that stays at the bottom of the screen: http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page. (Why should I have to use a wrapper div? I thought CSS was supposed to make unsemantic markup a thing of the past!)

There are of course many more such examples of when structurally superfluous markup is made necessary by CSS.

One specific gripe of mine with the CSS box model is that you cannot specify the total width or height of a block, making it very difficult to mix different size units (i.e. pixels, ems, points, percentages). For example, I can't specify that I want a block to have a total width of 50% including, say, a 1px border. I'd get an internal width of 50% plus 2px of border.

Other limitations include lack of support for vertical alignment and sizing, little flexibility in background images (though CSS 3 allows multiple background images, which is good).
 
Last edited:
Yes, it has it's limitations and I find it a bit silly that anyone would expect it to be perfect.

However, it's still easier, quicker and less hassle than doing everything in tables. I realise from your OP that you do not agree, but you have to ask yourself why almost everyone else disagrees. Either your skill with tables is amongst the greatest in the world, or you just need to use css more.
 
I've always been in two minds about this. I know tables are intended for, well, tabulated data and always felt using it for layout was a bit hacky and that there had to be a more elegant solution. However, the number of hacks and work-arounds you have to employ for even a simple CSS layout to work across different browsers is mind boggling! Hacks, resets, clearfixes, empty tags, floats, z-index etc etc.

I have always thought of CSS as style not structure and by using CSS to develop layout all you are really doing is splitting the end layout across two files - the css is written to make the structure of the page in the html display how you wanted, else why don't you just have a plain text with no markup (ie. no structure at all) and style that?

I appreciate the argument of "you only need to change the CSS to change a sites layout/look/feel" but have seen very few really elegant implementations and feel it is only applicable to static (or static-ish, thinking about Zen Garden here) websites.

That said, I do use CSS for layouts, but it requires substantial development and stricter standards to remove cross-browser inconsitancies before I even remotely become happy with it.
 
Last edited:
You must log in or register to reply here.
Back
Top Bottom