Float text left and right on same line

Hi,

I want to float some words to the left of a containing div and some to the right, on the same line.

If I do this:


<div style="width: 800px">
 <p style="float: left">Text should float left</p>
 <p style="float: right">Text should float right</p>
</div>

It works perfectly in IE, but in Mozilla the right text seems to be on the line below the left text. I need the two paragraphs to be vertically aligned.

Can anyone help?

Thanks…

Hello

this seems to work, if you set the default padding and margins to 0, and clear the float


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>12345 12345 12345 12345 12345</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	<style type="text/css">
	*{margin:0;padding:0;}
	
	head+/**/body .fc:after{
	content:".";
	display:block;
	height:0px;
	clear:both;
	visibility:hidden;
	}
	
	/* mac hide \\*/
	* html .fc{height:1%;}
	*+html .fc{display:inline-block;}
	/* End hide */
	
	.wra{width: 800px;background:#ccffff;}
	
	.wra p{float: left;background:#ff0000;}
	
	.wra .r{float: right;background:#ff0000;}
	</style>
	<script type="text/javascript">

	</script>
</head>
<body>

<div class="wra fc">
<p>Text should float left</p>
<p class="r">Text should float right</p>
</div>

</body>
</html>


Thanks, actually, all I needed was: *{margin:0;padding:0;} and it worked.

Thanks very much all4nerds.