Two Column Lists Using HTML

I know there are a million methods of breaking a list into two columns, but many of them involve additions to the CSS or new tables to be created.  But I like a different way.  The markup is all html, and it can easily be used in WordPress posts (using the view HTML tag at the top of the post editor).  The markup is pretty simple.  It is basically just two divs, one floated left and one floated right, with each only getting a percentage of the container.  Below is the markup in real time.

<div style="float: left; width: 50%;">
<ul>
<li>Left Item 1</li>
<li>Left Item 2</li>
<li>Left Item 3</li>
<li>Left Item 4</li>
<li>Left Item 5</li>
</ul>
</div>
<div style="float: right; width: 50%;">
<ul>
<li>Right Item 1</li>
<li>Right Item 2</li>
<li>Right Item 3</li>
<li>Right Item 4</li>
<li>Right Item 5</li>
</ul>
</div>

Live on the site it will look like:

UPDATE:

<div style="float: left; width: 33%;">
<ul>
<li>Left Item 1</li>
<li>Left Item 2</li>
<li>Left Item 3</li>
<li>Left Item 4</li>
<li>Left Item 5</li>
</ul>
</div>
<div style="float: left; width: 33%;">
<ul>
<li>Middle Item 1</li>
<li>Middle Item 2</li>
<li>Middle Item 3</li>
<li>Middle Item 4</li>
<li>Middle Item 5</li>
</ul>
</div>
<div style="float: right; width: 33%;">
<ul>
<li>Right Item 1</li>
<li>Right Item 2</li>
<li>Right Item 3</li>
<li>Right Item 4</li>
<li>Right Item 5</li>
</ul>
</div>

-matt