Click to See Complete Forum and Search --> : FF/IE Image Float Issue


barkley1979
06-19-2005, 04:04 PM
Please take a look at this site (http://www.darrenbayley.com/dabovilla/index.php)

I am trying to get IE to display the page exactly as it appears in Firefox.

Unfortunately I am encountering 3 main problems.

1. The most obvious - centering of the body
Using:
margin: 40px auto -1px auto;
2. The picture makes the menu div expand to fit in IE.
Using: position: relative;
background-image: url("images/house.gif");
width: 278px;
height: 194px;
top: 200px;
3. The 2/3 pixel gap between the blue and orange lines.
Using: padding-left: 25%; - is this causing this problem?

I want it to look exactly like it does in FF, but am pulling my hair out changing my padding, margin, top and left values to try and get them to fit properly.

If anyone can provide any pointers I would be grateful!

BonRouge
06-19-2005, 04:24 PM
Try using a complete DTD : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" " http://www.w3.org/TR/html4/strict.dtd ">

barkley1979
06-19-2005, 05:45 PM
OK, done that, but still no real difference. Any other ideas to where I am going wrong?

BonRouge
06-19-2005, 08:26 PM
For the second thing, try this : #content {
background-color: #F0F0F0;
margin-left:280px;
}
#menu {
float: left;
width:280px;
}

barkley1979
06-20-2005, 06:32 PM
Thanks for the suggestion, amended as suggested, but no change unfortunately. Am I missing something obvious here?

BonRouge
06-20-2005, 08:12 PM
Well, you put the wrong numbers - I said 280px and you put 200px.

barkley1979
06-21-2005, 01:05 PM
I tried 280px, but it made no difference, that is why there is a smaller px value now. But thank you for the help nonetheless.

BonRouge
06-21-2005, 05:58 PM
http://bonrouge.com/test/dabovilla.htm

barkley1979
06-21-2005, 06:20 PM
Many Thanks for the assistance. Your time has been appreciated!