...

View Full Version : div box not moving up on page ie7



crosswire
04-08-2011, 07:03 PM
Hi all
I currently was working on a page and everything was good looking in firefox. Then I checked it out in ie7. All hell broke loose.
so far i created a seperate css file for ie7
and things were ok except one part of the page.
Its a div box with 9 small boxes inside it. Everything is intact except its not at the center of the page like in firefox but at the bottom of the browser in ie7

this is what the div is coded as

#ccfbox {
width:100%;
zoom:1;
margin-left:120px;
}

and looks fine in firefox.
also the logo on right not lining up with the one of left. There are not floated

advice?

Excavator
04-08-2011, 07:31 PM
Hello crosswire,
In FF, with #wrapper set at 984px width, how can 95% wide #ccfbox have room for a 120px left margin?

In IE, how can 100% wide #ccfbox have room for any margin at all?

See the box model here (http://www.w3.org/TR/CSS2/box.html). The box model says that whatever you put inside an element cannot be larger than that element. margin/padding/border all count when figuring width/height.

To demonstrate, use some temporary background colors like this -
#wrapper{
text-align: left; /* Following line center aligns the layout */ margin: 0 auto; width: 984px;

background: #F5F5F5;


}

#ccfbox {
width:100%;
zoom:1;
margin-left:120px;
background: #f00;
}


In a set width container, why use % at all?
Why even a width at all???
Put a left margin on #ccfbox and no width, it will take all the room remaining.

Look at this example for another approach at building a simple 2 column layout (http://nopeople.com/CSS%20tips/simple_2-column/index.html).

crosswire
04-08-2011, 08:17 PM
thanks will take a look at your options
appreciate the response



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum