I'm sure you've used the style float:left/right to make text flow around an image. However, the float style can also be a powerfull ally in other scenarios - a great example is how easy it is to left-align and right-align text on the same line using it:
<div style="background-color:White; border: solid 1px gray; padding:4px; width:350px">
<div style="float:left">This text is on the left</div>
<div style="float:right">This text is on the right</div>
<div style="clear:both" />
</div>
The above markup renders:
The trick is really knowing the relationship between the float and clear styles. If we had left out the div with the clear:both style, it would render like this instead:
If you want to know the reason for that behavior, read up on the concept of containing floats :)
