PayneLess Designs - Text - Aligned Left, Right and Center

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Text - Aligned Left, Right and Center</title>
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="copyright" content="PayneLess Designs">
<meta name="author" content="Ron">
<style type="text/css">
* { margin: 0; padding: 0; border: 0; }

h1 { text-align: center; }

#example_one {
width: 800px;
height: 200px;
margin: 2% auto;
padding: 10px;
border: 1px solid #f00;
}

span.left { display: block; float: left; }
span.right { display: block; float: right; }

#example_two {
width: 800px;
margin: 2% auto;
height: 200px;
margin: 2% auto;
padding: 10px;
border: 1px solid #0f0;
}

p.left { float: left; }
p.right { float: right; }
p.center { text-align: center; }

p { font-size: 1em; }
</style>
<!--[if IE: >
<link rel="stylesheet" type="text/css" href="css_styles_ie.css">
<![endif: -->
</head><body>
<h1>Text - Aligned Left, Right and Center</h1>
<div id="example_one">
<p><span class="left">This text is aligned left</span> <span class="right">while this text is aligned right!</span></p>
</div>

<div id="example_two">
<p class="left">This text is aligned left.</p><p class="right">This text is aligned right!</p>
<p class="center">This text is centered.</p>
</div>
</body></html>