私はこのjsfiddleを作成しました。これは、ie(ie9でテスト)を除くすべてのブラウザーで正しく表示されます。http://jsfiddle.net/uxaPM/1/
ご覧のとおり、テキストの最初の部分を左に、2番目の部分を右にフロートさせ、各li内のすべてを1行に保持するという考え方です。ただし、<li>
私の例の3番目は分割されます。つまり、3番目<li>
は2行に分割されます。それぞれに最小幅を追加することで修正できることが<li>
わかりましたが、なぜこれが起こっているのか、そして問題に対してよりエレガントな解決策があるかどうかを知りたいです。