HTML Left and Right Align Elements

css, html

Solution

Some html:

<div class="left">left</div>
<div class="right">right</div>

Some CSS:

.left, .right {
  width: 50%; /* Floated elements technically need a width specified. */
}

.left {
  float: left;
}

.right {
  float: right;
}

Problem

To accomplish this I have done this: ``` <table style="width:100%;"> <tr> <td style="width:50%;text-align: left;">left</td> <td style="width:50%;text-align: right;">right</td> </tr> </table> ``` How could I accomplish this in the simplest fashion (least markup) without using tables? I just want to align 2 elements to the max left and right. There are hundreds of 2 column layouts out there, but they more aligned for page layout, and seem overkill.

Original source