Jump to content

Simlpe Float In Ff?


mboehler3

Recommended Posts

I am having an issue with floating an image to the left in FireFox. Here is how it looks in IE:float.gifImage floats to left while text is on right. However in FireFox the text is moved beneath the image, like this:nofloat.gifHere is my XHTML:

	<div class="roundedStageBox">	<div class="roundedStageBoxImage">	<img src="/images/stage-sales-tools.gif"  />	</div>	<p style="width:200px;">Proven tips and suggestions to guide you in your payroll conversations.</p>	</div>

And the CSS:

.roundedStageBoxImage {float:left; width:213px;}.roundedStageBox {background-image: url('/images/static_RoundedBox.gif'); background-repeat:no-repeat; width:470px; height:389px; padding:34px 0 0 17px;}

Is there an explanation for this? I read somewhere that you have to have a width declared when floating an element, which is why I have the width of the picture (213px) delcared with the float.thank you in advance to anyone willing to explain.

Link to comment
Share on other sites

IE renders padding/margins in a different way to over browsers. and setting width of paragraph forces it to be larger in size than where is is supposed to fit, so it has no option but to move down to a position where it will fit. try removing width of paragraph at least, and adjust padding.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...