text-align は文字の表示位置、margin はマージン（外側の余白）を指定するプロパティです。これらをhr要素に指定すると、水平線の表示位置（左寄せ、右寄せ）を指定できます。
指定方法はブラウザにより異なります。Netscapeなどでは左または右のマージンを0にすることで表示位置を指定できますが、IEなどでは text-align プロパティで指定する必要があります。どちらにも適用させたい場合には、この2つを同時に指定しておきます。
hr {
width: 50%;
text-align: right;
margin-right: 0;
}
| text-align | left … （左側に表示します）  |
|---|---|
| right … （右側に表示します） |
|
| margin-left | 0 … （左側に表示します）  |
| margin-right | 0 … （右側に表示します） |
何も指定しない場合は中央に表示されます。
<html>
<head>
<title>TAG index Webサイト</title>
<style type="text/css">
<!--
hr.left {
width: 50%;
text-align: left;
margin-left: 0;
}
hr.right {
width: 50%;
text-align: right;
margin-right: 0;
}
-->
</style>
</head>
<body>
<hr class="left">
<hr class="right">
</body>
</html>
▼これをブラウザで見ると次のように表示されます
