layout problem in firefox

[ylex1]

Hi

I have this section of a website that doesn’t display the way I want in firefox, it works in safari and chrome
http://www.cetem.com.mx/informacion.html

the styling for the content2 (the white background content) is

#in_content2{

float: left;

background: white;

height: 656px;

margin-top: 20px;

margin-left: 70px;

}

the content is wrapped in a 960 width centered layout and all the element in it are floated

is just that in firefox the div starts upper than in safari and in chrome also if you noticed the img on the first content (the blue background) it’s upper than it needs to be.

hope you can help!

[cybershot]

I changed your css rule for #in_content1 from

#in_content1 {
float: left;
}

to

#in_content1 {
height: 403px;
}

it looks good on my end. Try that and tell me what you think

[cybershot]

ps. I would not float the div left. I would add a margin-left to it but just enough to equal on both sides. You want the same amount of space on the left as you have on the right. Floating it left gives you much more space on the right than it does on the left. I would trim down that photo in the header from istockphoto. It is way to big. You don’t need all that space on the right side of it. just position it where you want it to be. then put some margin left on the div. I came up with about 40px and it looks pretty good.

[Author]

Posts