Q:

Place button above list container, right justified

I am trying to get a button to appear above an unordered list, and I want it right justified.   With CSS style "float:right", it appears on the right, but it is overlapping the list.   How can I get the button to appear on the right without overlapping the list? 
Code:
<style>
.mylist { list-style-type: none; width: 100%; }
.mylist li { margin: 2px; padding: 2px; border: 1px solid black;}
</style>

<button style="float:right; display:block;">Preview</button>
<UL class='mylist'>
    <LI>Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test</LI>
    <LI>Test</LI>       
</UL>

A:

Add clear:both to mylist style. 
Demo: http://jsfiddle.net/JgeTm/
CSS
.mylist{list-style-type:none;width:100%;clear:both}

