...

View Full Version : Image not positioning properly in FF



Squeak
05-17-2007, 01:51 AM
I'm having issues getting images to position properly on a website I'm building. It's the first site I've built on my own using CSS, and I've spent some time reading books and visiting websites in order to learn it. However, I simply cannot figure this problem out.

The page is http://www.soilsensor.com/overview.aspx

In IE 6, the image positions properly to where I placed it in the code, to the right of the first paragraph. However, when viewed in FF 2 the image is pushed down the page to the third paragraph.

This is particularly confusing because it's usually IE that mucks up CSS rendering, not FF.

If you need to see the CSS, it's at http://www.soilsensor.com/global.css

Any help would be appreciated, thanks!

koyama
05-17-2007, 02:18 AM
In IE 6, the image positions properly to where I placed it in the code, to the right of the first paragraph. However, when viewed in FF 2 the image is pushed down the page to the third paragraph.
In Firefox, whenever you apply clear: left/right/both to a float, then floats appearing later in source will never be positioned higher up than this float. I'm not sure if this is a violation of standards. I will need to investigate.

Anyway, from your source:


.sidebar {
width: 180px;
float: left;
margin-right: 15px;
margin-bottom: 15px;
border-top-width: 5px;
background: #C0C0C0 url(images/nav_bottom.jpg) center bottom no-repeat;
clear: left;
padding-bottom: 30px;
}
For now, to solve your problem, collect your 'Site navigation' and 'Site Sponsors' floats and wrap them in one single div. Then float that new div to the left. That should solve your problem.

Squeak
05-17-2007, 04:59 PM
Brilliant, that worked perfectly. That solution would never have occurred to me, thank you!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum