I may be using words incorrectly, and I'm not positive you can even make the distinction, and I am happy to stand corrected, but it always seemed to me that CSS was fine for style, but terrible for layout.
I think the issue, in terms of CSS being bad for layout, is that it tries to treat the logical structure of the document as the layout structure. If there were a way to restructure the document and then apply CSS to it a lot of things would get a lot easier and separation of content and presentation could be more realistic.
XSLT was interesting in providing some of this kind of restructuring power, but was far too heavyweight for pure layout manipulation.
Of course, this is also what flexbox tries to do and I think we'll be groaning about its lack of relative power in this area in the future when it's more established. It feels like a bandaid to me.
Right, to me plain HTML tables are great for overall master page layout yet it seems everything I've read and the few web geniuses I've met will deride using them over CSS.
Generally I agree that too many people have a fetish about avoiding tables when it's clearly the right tool for the job. But I've definitely been bitten by using them. Table layouts don't play well with other CSS properties.
If you are using HTML tables for layout then you definitely aren't using the right tool for the job. If it isn't tabular information then it doesn't belong in a table.
You can easily get around that by using `display: table` and `display: table-cell` So you have your semantic HTML elements, if you're into that sort of thing, and flexible layout options, like `vertical-align: middle`.
Why do people care about screen readers? Is it because they are good people and want to make sure sight-impaired visitors are able to access their content? Or is it because they have contracts that require 508 compliance?
I guess it's a good question. At a recent conference it [website accessibility] was described as the digital equivalent to putting a ramp in at your door.
Where I work at the moment I'm required to comply with WCAG2 AA at a minimum.
> but it always seemed to me that CSS was fine for style, but terrible for layout.
I think you're right there. When I've set colours, fonts, etc in CSS it's always worked first time, but getting layout right it feels like I'm fighting against the system all the time.
I wonder if it wouldn't make sense to build a tool that abstracts out the layout part of CSS? I once built a tool in python that lays out Tk/Tkinter GUIs[1] which I may have a go at adapting to produce CSS/HTML output.
This is as close as I can get without HTML tables:
<html>
<head>
<title>Testing making a footer with CSS</title>
</head>
<body>
<div id="divpage">
<div id="divcontent" style="overflow: auto; height: 60%;">
This is the content area.
</div>
<div id="divfooter" style="overflow: auto; height: 30%;">
This is the footer.
</div>
</div>
</body>
</html>
I usually go with the footer height 50px, content min-height 100%, bottom-margin -50px. Generally works, but still has some edge cases that can throw it for a loop.
Whereas what I instinctively want to do is something more like a conditional absolute positioning. If the content fits above the fold, then have the footer absolute at bottom:0. Else, have it relative to the content div. It can be done in JS of course, but I feel it should be a lot easier to do in CSS.
It's unbelievable just how annoying CSS can be for seemingly simple things.