WebAIM - Web Accessibility In Mind

E-mail List Archives

RE: Complex site design using only divs

for

From: Catherine Brys
Date: Dec 14, 2005 4:20AM

Hello,

Thanks for the suggestions, Tim and Ben.

I think I've solved the problem I run into - I wanted to explore how far I
could go with css - try and do a complicated layout with css.

I have found that it is possible to use divs for a grid-like design
(although vertical alignment is limited): the problem I had was due to
combining set widths (in %) with padding (in px). The browsers don't seem to
like it . I analysed the code of the W3C homepage and found that they use
one div in another, the outer div has the width, the inner has the padding.
Seems to work fine.

Best regards,

Catherine

Dr. Catherine M. Brys - PhD Eng
Library Web Services Administrator
- Library Web Site Accessibility and Usability Project -
Glasgow University Library, Hillhead Street, Glasgow, G12 8QE, Scotland, UK
e: c.brys [at] lib.gla.ac.uk
t: +44 (0)141 330 6748
w: www.lib.gla.ac.uk/accessible


-----Original Message-----
From: Tim Beadle [mailto: <EMAIL REMOVED> ]
Sent: 08 December 2005 10:17
To: WebAIM Discussion List
Subject: Re: [WebAIM] Complex site design using only divs


On 08/12/05, Catherine Brys < <EMAIL REMOVED> > wrote:
> I am working on a new design for our site. I would like to use only <div>s
> AND use the float attribute (no absolute or relative positioning).

What's wrong with positioning? It's as valid an approach as floating.

> Do you know any sites which have a grid layout (e.g. similar to
> http://www.glasgow.gov.uk/en/Business/) and use 'floating' <div>s only?

www.capgemini.com ?

> It seems hard to obtain a grid layout with 'floating' <div>s because one
> <div> 'does not know' how high/wide its neighbours are.

Indeed, which is where this blog entry by Jeffrey Zeldman may help
influence your thinking. I quote:
"Grids are used to balance the design of books, ads, posters, and
paintings. They are also often used in web design, particularly when
it is executed via HTML tables or Flash. The grid has a long and noble
history in the design of two dimensional media. But it is not the only
way to design web pages and it is certainly not the _webbiest_ way."
(emphasis his).

http://www.zeldman.com/daily/0403b.shtml#rulesbaseddesign

My recommendation would be, therefore, to ditch the grid. CSS allows
so much more, and if you're going to allow for varying font, window
and screen sizes, then grids don't really fit the bill. They work fine
for fixed molecules of ink on fixed-size pieces of paper, but not on
the web.

> I don't want to use scripting.

Again, I'd say: why not? If it's used to progressively enhance the
user experience, then it's a very valuable tool to achieve effects
like this:
http://www.themaninblue.com/experiment/ResolutionLayout/
( Blog entry: http://www.themaninblue.com/writing/perspective/2004/09/21/ )

Hope that helps!

Regards,

Tim