DIV alignment

There are three ways to achieve side-by-side divs.

One is to start with a div that has a side margin to
create a sizable empty space next to it, then
absolutely position a second div, dropping it into
that empty space. This layout demo uses that method:

http://positioniseverything.net/thr.col.stretch.html

The other way is to make the first div a float, giving
it a defined width, and having a following div with a
side margin of the same width as the preceeding float.
The side margin is not required, but then the following
div is actually in the same starting position as the float.
and only the "inline" contents (text) within the following float
stay out from beneath the float, and once below the float
the text is allowed to fill the entire width available.

THis article explains these points in detail:

http://positioniseverything.net/articles/float-theory.html

Another article that explains the overall flowing and positioning
scheme of CSS is here:

http://positioniseverything.net/articles/flow-pos.html

There is one major bit of nastiness you need to be aware of
when using floats in IE/win, detailed in these pieces:

http://positioniseverything.net/articles/towards.html
http://positioniseverything.net/floatmodel.html

HTH
Big John

In general you can cause block elements to display inline by using display: inline; on them. It's a good way to add accessibility to such things as horizontal navigation bars because you can use an unordered list with an anchor in each list item.

Try this:

div.myclass {
     display: inline;
}

There's a little example on my site.

Hi Big John,

Bez here from Sunny ( or not so sunny ) England UK I've been teaching myself CSS as I am making web sites for community groups and trying to make them as accessible as possible.

I've done a couple of sites.
http://www.dcrp.co.uk
http://www.doncasterrefurnish.co.uk

Both of which are "tableless" yee harr.. i'm not sure how they show up on different browsers netscape 6 seems okay as does IE 6 I was just wondering if you could give them a quick look and see how I'm doing for a novice !

I've coined a phrase which might catch on as I've been told that my designs are crap in CSS... So I fought back with a new phrase which might catch on ?

"ARE U A WEBSITE WAITER" ( tables everywhere ! )

Anyhow your site is great and taught me a lot. Thanks

I can't take time to get into it, but a cursory
look seems not to bad. There's many things
that can be improved, but hey, yer a newbie,
right? All that stuff will come in time.

The main thing is to cultivate an incredibly anal
attitude about the code. Let nothing escape
notice and you will have far fewer problems.
Now if only I could follow that advice...