Internet Explorer 6

CSSソース

.container {
     width: 400px;
     height: 110px;
     margin: 0 auto 10px;
     padding: 10px;
     background: #6AACDB url(img/bg.gif) no-repeat right bottom;
     border: 1px solid #666;
}

ほかのWebブラウザ

XHTMLソース

<div class="container">
 <p>
  テキスト量は一定の為、height指定して固定しているが、
  文字サイズを変更するとテキストが重なってしまう。
 </p>
 <p>
  テキスト量は一定の為、height指定して固定しているが、
  文字サイズを変更するとテキストが重なってしまう。
 </p>
</div>
<div class="container">
 <p>
  テキスト量は一定の為、height指定して固定しているが、
  文字サイズを変更するとテキストが重なってしまう。
 </p>
 <p>
  テキスト量は一定の為、height指定して固定しているが、
  文字サイズを変更するとテキストが重なってしまう。
 </p>
</div>

CSSソース

p {
     margin: 0 0 1em;
     padding-right: 150px;
     font-size: small;
}
.container {
     width: 400px;
     height: 110px; ←①
     margin: 0 auto 10px;
     padding: 10px;
     background: white url(img/bg.gif) no-repeat right bottom;
     border: 1px solid #666;
}
body > .container {
     height: auto;
     min-height: 110px;
}

• 第5章 実践的なCSSデザインの法則