Hi there. I think you need a block level element after #wrapper element.
I use a couple of hacks to make this work well in different browsers.
Give this a try.
<style>
#wrapper {
border-left: 6px solid #FFCC33;
border-right: 6px solid #FFCC33;
background-color: #fff;
border: solid 1px red;
}
/* hack for proper expansion of float wrapper */
#wrapper:after {
content: '.';
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#wrapper {display: inline-table;}
/* Hides from IE-mac \*/
* html #wrapper {height: 1%;}
#wrapper {display: block;}
/* End hide from IE-mac */
#wrapper p {
font-size: 9px;
margin: 0;
padding: 3px 10px;
display: inline;
float: left;
}
#wrapper p.test {
text-align: right;
float: right;
}
</style>
<div id="wrapper">
<p>align left</p>
<p class="test">align right</p>
</div>
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/