css - div幅を反対側端まで自然に広げる問題

Question

次のように div を自然に展開するのに問題があります。

パーセンテージの使用は許可されていません。私はそれらを使用しようとしましたが、他のアイテムがそれらの間に入るとすぐに、2番目のブロックがダウンします.

HTML コード:

 <div class="block1">
     <ul>
         <li>item long</li>
         <li>item small</li>
         <li>item sample</li>
     </ul>
 </div>

 <div class="block2">
     <a>This is a nice sample text</a>
 </div>

CSS コード:

 .block2{
     float:left;
     border:1px solid blue;
 }
 .block1{
     float:left;
     border:1px solid red;
 }

これが私のフィドルです