text-align: ***; margin-***: ***;
text-align は水平方向の揃え方を、margin-*** は上下左右のマージンを指定するプロパティです。これらのプロパティをhr要素に対して設定すると、水平線の表示位置（左寄せ、右寄せ）を指定することができます。
指定方法はブラウザにより異なります。Firefoxなどでは、左または右のマージンを0にすることで表示位置を指定できますが、IEなどでは text-align プロパティで指定する必要があります。どちらにも適用させたい場合は、この2つを同時に指定しておきます。
※表示位置を指定する場合は、同時に水平線のサイズを指定しておく必要があります。（長さの初期値が100%なので）
hr {
width: 50%;
text-align: right;
margin-right: 0;
}
| プロパティ名 | 値 | 説明 |
|---|---|---|
| text-align | left | 左側に表示   |
| right | 右側に表示 |
|
| margin-left | 0 | 左側に表示    |
| margin-right | 0 | 右側に表示 |
何も指定しない場合はセンターに表示されます。
※IE 8では、右寄せ（right）を指定すると左寄せになってしまうようです。（バグ？）
使用例
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>文書のタイトル</title>
<style type="text/css">
hr {
width: 60%;
margin-bottom: 15px;
}
hr.example1 {
margin-left: 0;
text-align: left;
}
hr.example2 {
margin-right: 0;
text-align: right;
}
</style>
</head>
<body>
<hr class="example1">
<hr class="example2">
</body>
</html>
表示例
- ブラウザ
- 特性
- text-align
- margin-***
- サイト内検索
