A simple layout question...

technostick posted this at 21:43 — 2nd October 2005.

They have: 27 posts

Joined: Sep 2005

I know this is a rather simple question, but I have always had trouble doing a simple two column layout with CSS.

What I want is something like - and I can do it easily using tables (please ignore the hyphens):

menu1---content,
menu2---more content,
---------even more content,
---------blah blah blah...

I apply this CSS (or something similar):

.menu {float: left; width: 10em; */ or whatever...*/}
.content {color: blue;}

and this html:

menu1
menu2

content,
more content,
even more content,
blah blah blah...

Unfortunately, this is what I get:

menu1 content,
menu2 more content,
even more content,
blah blah blah...

Do you know how I can get the main content not to wrap around the menu?

Thanks a lot!

JeevesBond posted this at 22:52 — 2nd October 2005.

He has: 3,956 posts

Joined: Jun 2002

Check this:
http://intermedia-online.com/personal/help/csstest.html

The important bit here is:

#menu {
	float: left;
}
#content {
	margin: 1em 8em;
}

As you're asking the menu to float on the left side text will always try to wrap around it, that's what you're asking for... However what I think you want is a margin, hence the 8em

Hope this helps!

a Padded Cell our articles site!

technostick posted this at 08:53 — 3rd October 2005.

They have: 27 posts

Joined: Sep 2005

Thanks!