リストのポッチ

@Takazudo

こういうのどうやって書くか

アイコン置く場合1

demo

• text-indent で下げてそこにアイコン置く
• img は middle 配置
• 右にちょっとマージンで行頭位置揃え
• そこから上下にネガティブマージンで実質画像の高さ消す
• ついでに上にちょい上げる

アイコン置く場合2

demo

• text-indent で下げてそこにアイコン置く
• spanをinline-blockにしてimg囲む
• その中で左右中央寄せにしたり
• 幅高さのバリエーションを持てる
• IE7以下ではinline-blockの上下ネガティブマージンイマイチなので注意

リストマーカー1

demo

• クラシックな左上から背景画像配置
• でも左上基準だとなんかなー

リストマーカー2

demo

• text-indent で下げてそこにアイコン置く
• li:before を inline-block にして middle 配置
• そこから上下値ネガティブマージンで調整
• IE8〜なので注意

リストマーカー3

demo

• a:before にマーカーを置けばマーカーもクリックできる

こんな書き方のほうがいいとかあればおせーてください