スタイルシートで入れ子の内側のブロック要素を中央寄せにする

スタイルシートで入れ子の内側のブロック要素を中央寄せにする方法です。

テキストテキスト
テキスト

テキストテキスト
テキスト

上のような入れ子のブロック要素を、

テキストテキスト
テキスト

テキストテキスト
テキスト

のようにしようと、外側のブロックのスタイルに「text-align:center」を指定すると、

テキストテキスト
テキスト

テキストテキスト
テキスト

となり、うまくいかない。
これは、内側のブロックのスタイルに「margin:0 auto;」を追加することで解決。

以下サンプルコード

<style type="text/css">
.block1{
width:200px;
color:#000;
border:5px solid #999;
}
.block2{
width:100px;
color:#000;
border:5px solid #00f;
margin:0 auto;
}
</style>

<div class="block1">
<div class="block2">
テキストテキスト
テキスト
</div>
テキストテキスト
テキスト
</div>