2 replies [Last post]
aebstract
Offline
Regular
Last seen: 12 years 42 weeks ago
Joined: 2008-01-31
Posts: 15
Points: 0

Hi,
Firstly, this is my first time posting here. Wink I've never really posted in a css forum, but decided to go ahead and seek some assistance in my issue.

I have a div with many inside, the outside one being a container to hold everything in the center of the page. The container has a background image that should stretch with everything inside of it. This was working perfectly fine, and for some reason it just quit working in firefox, works fine in IE.

body { margin: 0px; padding: 0px; text-align:center; background-color: #FFFFFF; background-image: url(images/bg.jpg); font-size: 10px; font-family: Arial, Helvetica, sans-serif; }

#container {
position: relative; top: 0px; left: 0px;
background-image: url(images/containerbg.gif);
margin-left: auto;
margin-right: auto;
text-align: center;
width: 976px;
}

#center {
position: relative; top: 0px; left: 0px;
background-color: #000000;
margin-left: auto;
margin-right: auto;
width: 804px;
}

#header {
width: 603px;
height: 61px;
background-image: url(images/header.jpg);
float: left;
}

#topright {
width: 201px;
height: 35px;
background-image: url(images/topright.jpg);
float: left;
text-align: right;
}

#user {
width: 201px;
height: 26px;
background-color: #000000;
float: left;
text-align: right;
color: #FFFFFF;
}

#bbar1 {
width: 804px;
height: 25px;
background-color: #000000;
float: left;
}

#products {
width: 804px;
height: 175px;
background-image: url(images/products.jpg);
float: left;
}

#bbar2 {
width: 804px;
height: 23px;
background-color: #000000;
float: left;
}

#navbar {
width: 804px;
height: 38px;
background-image: url(images/navbg.jpg);
float: left;
}

#body {
width: 804px;
background-color: #FFFFFF;
float: left;
text-align: left;
}

#footer {
width: 804px;
height: 58px;
background-color: #000000;
float: left;
text-align: center;
color: #FFFFFF;
}

www.berryequipment.net/2/ if you want to see it in firefox/IE.
Thanks!

drhowarddrfine
Offline
Leader
Last seen: 11 years 5 days ago
Timezone: GMT-6
Joined: 2005-05-21
Posts: 764
Points: 0

I'm not on my web dev

I'm not on my web dev computer but it's possible you are seeing IEs bug and not anything wrong with Firefox. Containing elements are never to expand to contain floated elements. If what you are describing is floated inside the container, then this is an IE bug.

To fix this, try adding 'overflow:auto' to the parent container.

IE7 is 10 years behind the standards or wrong.
But it works in IE!
IE is a cancer on the web -- Paul Thurott

aebstract
Offline
Regular
Last seen: 12 years 42 weeks ago
Joined: 2008-01-31
Posts: 15
Points: 0

edit: fixed it, thanks man.

edit: fixed it, thanks man.