WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:【CSS】リストとボックスの横幅について

0:[投稿] こたねこ [2007/07/19 17:28 ] [環境:IE7 Firefox2 わからない]

初めて投稿させて頂きます。
横並びのメニューをリストで表示して、その下にメニューと同じ横幅のボックスを
置きたいのですが、どうしてもずれてしまいます。

どのようにすればリストとボックスの横幅を合わせられるのか、ご指導頂けると助かります。
よろしくお願いします。


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>hoge</title>

<style type="text/css">
.list{
        float: left;
        display: block;
        border-style: solid;
        border-color: #0033FF;
        border-width: 1px;
        width: 120px;
}

.box1{
        clear: both;
        border-style: solid;
        border-color: #FF0000;
        border-width: 1px;
        width: 600px;
}

</style>
</head>

<body>
    <ul>
        <li class="list"><a href="./company.html">メニュー1</a></li>
        <li class="list"><a href="./work.html">メニュー2</a></li>
        <li class="list"><a href="./direct_sale.html">メニュー3</a></li>
        <li class="list"><a href="./access.html">メニュー4</a></li>
        <li class="list"><a href="./ura.html">裏メニュー5</a></li>
    </ul>
    <div class="box1">ボックス</div>
</body>
</html>


1:[回答] 特命 [2007/07/19 22:45 ]

宣言などがかかれていませんが?
width120*5=600と思っておられるようですが。
widthに含まれるのはどれ?
margin/padding/border

モードによって違うんです。ちょっと調べてみてください。
ブラウザによっても違うんです。いろいろやってみてください。

回答(必須): 状態:

お名前(必須):

URL:




[戻る]