« GPS-Web連携あれこれ | メイン | google map api と google 検索のキャッシュ »

リストのインデント量調整

あとで読む

覚え書き。 

ソース
<ul>
    <li>アイテム1</li>
    <li>アイテム2</li>
</ul>

表示

  • アイテム1
  • アイテム2
  なんて構造があるとき、<li>のインデント量が大きすぎる(ブラウザによるけど)と感じることがある。このインデント量の調整はスタイルシート的には margin-left で調整するようだが、margin-left: 0 のときが標準のインデント量なので、それよりも少なくしたい場合はマイナスの値を設定する必要がある。-1emくらいが無駄がない感じで好き。インデント量は padding-left で調整するほうがよかったね。。。。

スタイルシートソース
ul {
   margin-left: -1em;
    padding-left: 2em;
    margin-left: 0px;  // IE の場合、デフォルトで margin が設定されているようで。
}

表示

  • アイテム1
  • アイテム2

 

やるすぎるとアイテムの先頭数文字が見えなくなったりするので注意。padding-left: 0px でインデントなし。

Trackbacks

Trackback URL:
http://groundwalker.com/mt/gwtb.cgi/35

« GPS-Web連携あれこれ | メイン | google map api と google 検索のキャッシュ »

スポンサー

関連ブログ

あわせて読みたい

関連キーワード

Powered by
Movable Type 3.34

連絡先