2009年07月03日

<hr> タグ:水平線の見栄えがブラウザごとに大きく違う件

hrタグ:水平線の見栄えがブラウザごとに大きく違うので、デザインを考える際に苦労する。特に、余白・マージンの見栄えに違いが出やすい。そんなときの解決法。

htmlには、以下のように記載

<div class="hr"><hr /></div>

スタイルシートには、例えば以下のように記載。

div.hr {
  padding-top : 6pt;
  margin-top : 6px;
  border-top-width : 1px;
  border-top-style : solid;
  border-top-color : #666666;
}
div.hr hr {display: none;}

これで、様々なブラウザにて同様に表示されるはず。






■
サトー
posted at 20:51
この記事をクリップ!

トラックバックURL

コメントする

名前
URL
 
  絵文字