Forum Moderators: not2easy

Message Too Old, No Replies

floating images in firefox float into another <div>

         

mb2005

5:17 am on Oct 8, 2005 (gmt 0)

10+ Year Member



I've been struggling the last few days trying to figure out where I'm going wrong. I have 4 containers on the page with a floating image in each. In three containers the images are where I need them, but in one container the image mysteriously ends up in the 4th container beside the floating image that belongs in that container.Could someone look over this css code and point out any errors?

#content-container-1 {
width: 170px;
height: 100px;
background-color: #ffffff;
margin-top: -220px;
margin-left: 380px;
border: 1px solid #5e5e5e;
}

#content-container-2 {
width: 170px;
height: 100px;
background-color: #ffffff;
margin-top: -221px;
margin-left: 570px;
border: 1px solid #5e5e5e;
}

#content-container-3 {
width: 170px;
height: 100px;
background-color: #ffffff;
margin-top: 18px;
margin-left: 380px;
border: 1px solid #5e5e5e;
}

#content-container-4 {
width: 170px;
height: 100px;
background-color: #ffffff;
margin-top: 18px;
margin-left: 570px;
border: 1px solid #5e5e5e;
}

.float_left {
float: left;
padding: 5px;
}


HTML Code: (same code for content in each container)

<div id="content-container-1">
<img class="floatleft" src="../images/image.jpg" alt="" width="60" height="60" />
<p>Content Description</p>
</div>

Thank you.

mb2005

5:20 am on Oct 8, 2005 (gmt 0)

10+ Year Member



I would also like to add that I'm not having this error in IE.

tedster

4:04 pm on Oct 8, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



What you've posted looks fine to me. Have you validated the html? IE's error recovery is quite forgiving in areas where FF is not, and even a hard to spot typo can have strange results.

W3C Validator - HTML [validator.w3.org]

LadynRed

5:29 pm on Oct 12, 2005 (gmt 0)

10+ Year Member



You would be a whole lot better off and save yourself some hair-tearing if you'd design to a standards-compliant browser, like Firefox, FIRST. IE will inevitably screw something up but its a whole lot easier to do it right then put in whatever 'adjustments' you need to make IE behave.

Believe me, it'll save your sanity. Most of the IE bugs are known and there are fixes and workarounds for them. Working with IE first, which gets so much WRONG, will drive you nuts.