Firefox 3.0 rendering differently then 3.5 (but the same as ie8)

[jive]

Hello Guys,

I ran all of my tests on Firefox 3.5, IE7 & 6, but when I showed it to my client they happened to be using Firefox 3.0 and IE8.

Anyways, I'm having a tough time fixing my issue for these two browsers.

Please view it here:
http://www.zero1productions.com/hirato/videos.php

The problem is that the titles drop below behind the content on these browsers. I have no idea how to target two separate versions of firefox that renders differently.

Thanks for any help.

[ralph.m]

Which titles drop below which content? I'm not clear on what's happening.

[jive]

hey Ralph, the titles "Ergonomically correct & Accurate", "36 Led Light", "accurate Angle Everytime" and the "left & right hand shears" titles. The are the titles for all of the paragraphs. In Firefox 3.0 and IE8 they are dropping where the paragraph text is.

[ralph.m]

they are dropping where the paragraph text is.

On FF3.5, Safair and IE8 those titles are the same for me. Do you mean that you want the titles above the paragraph and image?

[RyanReese]

I can't replicate this on my FF .

[jive]

Hey guys,

I appreciate you willingness to help. I have uploaded Screenshots. The first is Firefox 3.0 (with the titles dropping into the text) the Second is Firefox 3.5 (this is how it should display)




Firefox 3.5:

[ralph.m]

Hmm, I can't test this either, but you could try altering your styles to this (new style in blue):

.thumbContent p {
	font: 12px arial;
	width: 220px;
	float: right;
	margin: 15px 7px 0px 0px;
}

.thumbContent a, .thumbContent img {float:left;}

[RyanReese]

I don't feel like installing FF3.0

So here we go with a blind guess . On ".thumbContent p" give that clear:right; and on ".thumbContent img" give that float:left;

[joan.lopez]

Hello!

I'm using FF 3.0.15 -- i can see the error
using IE 6.0 -- no error found

This is same as our problem before but I could not remember what was our developer did in solving.

[RyanReese]

Hello!

I'm using FF 3.0.15 -- i can see the error
using IE 6.0 -- no error found

This is same as our problem before but I could not remember what was our developer did in solving.

When an inline element comes before a float the spec doesn't specify whether it should be all on the same line or it should drop. I think that's the issue which is why I told the OP to float the image .

[jive]

this worked. Fixed it for all three:

".thumbContent p" give that clear:right; and on ".thumbContent img" give that float:left;"

Way to go Ryan!

[RyanReese]

this worked. Fixed it for all three:

".thumbContent p" give that clear:right; and on ".thumbContent img" give that float:left;"

Way to go Ryan!

Glad to hear that .