firefox/IE - looks fine in IE, bad in firefox - CSS forum at WebmasterWorld

Forum Moderators: not2easy

Message Too Old, No Replies

firefox/IE - looks fine in IE, bad in firefox

float doesn't seem to be working in firefox

andylarks

9:59 am on Aug 3, 2005 (gmt 0)

So I'm really getting cross with this whole CSS thing, especially knowing that I could have written this in half the time in tables, only because I know what I'm doing with tables.

[snip]

looks fine in IE, but in firefox, the content sits over the menu, and the menu is knackered.

I've been backwards and forwards with this, trying everything I can think of. If I remove the doc-type, firefox renders the menu almost-correctly, but still has the content over the meny, and IE loses its' ability to center the page.

If anyone can help me with this, I would be so grateful.

Thanks

Andy

[edit: no urls, please. See CSS Forum Charter [webmasterworld.com] for details.]

[edited by: createErrorMsg at 10:51 am (utc) on Aug. 3, 2005]

andylarks

11:37 am on Aug 3, 2005 (gmt 0)

EDIT:

Doc type is:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" [w3.org...]

CSS has:

#container {
position: relative;
margin:auto;
padding:0;
width:700px;
}

within which sit:

#content {
position: relative;
width: 700px;
background-color: #0c6a3b;
}

#menu {
position:relative;
width: 170px;
float:left;
}

#info {
position:relative;
width: 510px;
padding: 10px 10px 10px 10px;
background-color: #d5f3cc;
float: left;
}

Info is the one that causes the problem...

thanks :o)

creativexperience

9:51 pm on Aug 3, 2005 (gmt 0)

By looking at your CSS i would say you have got 3 elements next to each other.

I take it you want to do first element - Menu, 2nd - Content and 3rd - info?

Or is the menu and info inside the content?

Show your sourcecode it would help.

At the moment it looks as if you are trying to force 3 elements with a width of 1400px into a container with 700px.

Pixelgamer

11:17 pm on Aug 3, 2005 (gmt 0)

I think it seems more like he is trying to put the menu and the info next to each and below or above the content div. But really there is no use guessing the layout, some source code would be good, and also I saw oyu hade missed 'px' at one place in your css..

Pixelgamer

11:20 pm on Aug 3, 2005 (gmt 0)

And btw, you dont need to declare all padding widths if all are the same, just stick with padding: 10px;

Also, is it really meant that the menu and the info should only be 680px in total?

andylarks

12:05 pm on Aug 4, 2005 (gmt 0)

Hi all, thanks for replying.

structure sits like this:

The reasoning is that I want menu to sit on a background that will grow to whatever size the "info" section.

Pixelgamer

3:07 pm on Aug 4, 2005 (gmt 0)

And where is the #content div in the layout? inside the container, outside?