View Full Version : <div> problem

10-11-2004, 05:00 PM
I have started this site today and already run across a problem - the layout has gone really wrong. You can find the site @ http://users.quickfox.org/~chilipie/digicheese. The code is loosely based on a layout on Glish - http://www.glish.com/css/9.asp.

And this picture is what it should look like (I edited what I had with PSP):

10-11-2004, 05:51 PM
First, give your body a container. Then, apply the following CSS:

#container {
margin: 0 auto;
text-align: left;
width: 700px;

Modify the #menu to float left.

10-11-2004, 06:05 PM
Hmmmmmmm... :confused:

Now the #menu has moved below the #main. (I've re-uploaded it, so you can see what it looks like.)

Also, is there any way of making #menu the same height as #main?

10-11-2004, 06:11 PM
Heh... Sorry... I forgot that I had resized #menu to width:148px to make it fit with the layout. I'm going to check into the height thing.

/* Edit */

For #menu, try giving it a height of 19.1em. That worked at 1024x768 (my normal res) and 1280x1024 (things are tiny!)
If that doesn't work, I would play around with it.

Remember: height and percentages don't work well, use ems for height.

10-18-2004, 04:24 PM
Perfect :p thanks! However, stupid IE ****s it up. When you hover over the top 2 links, the whole navbar jumps up, and the menu also falls short of the footer.

(Sorry to dig this topic up again, but I thought it would be better than starting a new one.)

The new link is http://redblizzard.hostmatrix.org/digicheese/index.htm

10-19-2004, 06:16 PM
To solve the menu falling short of the footer is there a way of setting a different style sheet for IE, or preferably a way of making sure the content area (#main) and the menu (#menu) are always the same height?

Any help appreciated, :)