Left Align and Right Align Text on the Same Line

It can sometimes be useful to have some text be aligned to the left and some text be aligned to the right on the same line. For example, in a footer, where you might want to have copyright info on the left and webmaster info on the right. Here is how you might want your HTML:

<div id="textbox">
  <p class="alignleft">Text on the left.</p>
  <p class="alignright">Text on the right.</p>
</div>

If you were to then give your CSS classes alignleft and alignright values of text-align: left; and text-align: right; respectively, you would get close to your desired result, but your right-aligned text would be bumped down one line because of the new paragraph. Instead, just float your paragraphs:

.alignleft {
float: left;
}
.alignright {
float: right;
}

Then just remember to clear your float:

<div style="clear: both;"></div>

[LIVE EXAMPLE]