...

View Full Version : Float Right Causing Problems in IE 6 & 7



teamleaf
03-30-2009, 03:36 PM
Normally I wouldn't care about IE, but IE 6 & 7 unfortunately make up the VAST majority of my site's visits.

So... everything in fine in FF and Safari, hell, it even looks fine on my iPhone, but in IE 6 & 7, my affiliate graphic links display in line with the image box that is meant to contain them.

http://www.teamleaf.org/ is the site. It is the home page that is having the problem.

Here is the lines of code in question:

<div style="float:right;"><img src="images/ClustrMapAd.png" width="200" height="125" border="0" /></div>
<div style="float:right; margin-top:16px; margin-right:-180px;"><a href="http://www2.clustrmaps.com/counter/maps.php?url=http://www.teamleaf.org" id="clustrMapsLink"><img src="http://www2.clustrmaps.com/counter/index2.php?url=http://www.teamleaf.org" style="border:0px;" alt="Locations of visitors to this page" title="Locations of visitors to this page" id="clustrMapsImg" onerror="this.onerror=null; this.src='http://clustrmaps.com/images/clustrmaps-back-soon.jpg'; document.getElementById('clustrMapsLink').href='http://clustrmaps.com';" /></a></div>

<div style="float:right; margin-top:125px; margin-right:-200px;"><img src="images/ThanksAd.png" width="200" height="125" border="0" /></div>
<div style="float:right; margin-top:141px; margin-right:-180px;"><a href="http://www.greenscapegardens.com/"><img src="images/GreenscapeAD.png" border="0px" /></a></div>

The parts in bold are what is not aligning properly.

Yes, I know I'm using in line styling, but I don't have time to change that at this point.

Also, my page is valid except for alt tags on most of the images which isn't a big deal right now.

Thanks in advance!

abduraooft
03-30-2009, 03:43 PM
I'd recommend you to check http://bonrouge.com/3c-hf-fluid.php to see how to build a good 3 column layout.

teamleaf
03-30-2009, 03:48 PM
I'd recommend you to check http://bonrouge.com/3c-hf-fluid.php to see how to build a good 3 column layout.
I just briefly started on it...

http://www.teamleaf.org/indextest.html

IE doesn't seem to see that entire right column.

What gives?

Excavator
03-30-2009, 05:58 PM
I just briefly started on it...

http://www.teamleaf.org/indextest.html

IE doesn't seem to see that entire right column.

What gives?

You need to go through your CSS and clean out the leftover/redundant stuff that is in conflict.
For example -

body {
margin-left: 0px;
margin-top: 8px;
margin-right: 0px;
margin-bottom: 0px;
background-color: #FFFFFF;
}
html {height:100%;}
body {
margin:0;
padding:0;
height:100%;
background:#ffffff;
}


#main {
width:1000px;
height:400px;
position:relative;
}
#Main {
position:absolute;
left:50%;
top:0px;
width:850px;
margin-left: -425px;
height:400px;
}


Validating shows plenty of errors that can be fixed. Both in your CSS and your markup.


...

teamleaf
03-31-2009, 02:16 AM
Problems resolved. I used the 3 column layout with my own adjustments and modifications. Thanks!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum