よく見かける下のような横に並んだリストがあって、
- 要素1
- 要素2
- 要素3
これの前にチェックボックスをつけようとして上手くいかず、苦しんだのが悔しかったのでメモ。
単純に<input>を置くだけでは下のように段差ができるし、<input>や<ul>にstyle="display: inline;"を指定しても同じ。チェックボックスとリストを同じ<div>でくくってみたりしても、もちろんダメ。
- 要素1
- 要素2
- 要素3
さんざん悩んだ挙句、やっと気づいた方法が<input>もfloatさせればよいということ。
- 要素1
- 要素2
- 要素3
わかってみれば超当たり前のことだけど、リスト要素と同列にfloatさせるという発想が思い浮かばなかったのが敗因。
![inamenai [at] gmail.com](http://blog.inasphere.net/images/mailaddress.gif){kind=small}
