人に聞けない痔の悩み、これでスッキリ >>

以下のソースで、文字列のside side...の高さをmain,main...に揃えたいです。
色々試してみたのですが、side の文字のある側の背景が下まで伸びてくれません。
どうしたらよいでしょうか。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<style TYPE="text/css">
<!--
body{
font-size: 10pt;
text-align: center;
}

#container {
width: 752px;
border-left: 1px solid #599E3D;
border-right: 1px solid #599E3D;
}

#main {
float: right;
width: 570px;
background: #FFFFFF;
}

#side {
float: left;
width: 180px;
background: #E0FFFF;
border-right: 1px solid #F2992F;
}
-->
</style>
</head>

<body>

<div id="container">

<div id="main">
main<br>
main<br>
main<br>
main<br>
main<br>
</div>

<div id="side">
side<br>
side<br>
side<br>
</div>

</div>

</body>
</html>

A 回答 (1件)

#containerに「752px(横)×1px(縦)」の背景画像を指定してrepeat-yにしてみてください。



#container {
width: 752px;
background: #FFFFFF url(/img/img_bk_01.gif) repeat-y top;
}

で、#sideの指定は削除。

#side {
float: left;
width: 180px;
}

どうですか。
    • good
    • 0
この回答へのお礼

できました!
とても助かりました。
ありがとうございました。

お礼日時:2007/06/19 23:22

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!


人気Q&Aランキング