borderの範囲
cssコーディングに関しての質問です。
現在以下のようなスタイルとHTMLを組んでいます。
==css============
#style1 {
width:500px;
padding: 15px 0 0 15px;
border-left:1px solid #ccc;
border-top: 1px solid #ccc;
}
#style1 p {
margin:0;
padding:0;
}
.style2 {
float:right;
clear:both;
margin:0 0 20px 30px;
}
.style2 img{
margin:0;
padding:0;
}
==html============
<body>
<div id="style1">
<div class="style2"><img src="sample.jpg" width="200" height="200"></div>
<div class="style2"><img src="sample.jpg" width="200" height="200"></div>
<p>サンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプル</p>
</div>
</body>
イメージをfloat:right;に指定し、
縦並びにしたいので、clear:both;を入れた所、
border-left:1px solid #ccc;のborderが文字までは表示されるのですが、
画像の延長上は無くなって表示されてしまいます。
右に画像を配置し
borderを伸ばしたい時はどのようにすればよいのでしょうか?
よろしくお願いします!
お礼
やっぱりできないんですかぁ。。。 ありがとうございました!