1


0

CSSでのナビゲーションメニューの問題(div全体の背景が表示されない)

私はウェブページのCSSコードを書いています、私はコードの上部にナビゲーションメニューがあります:

            Services
            About us
            Tell a friend
            Mission
            Contact us

nav-menuのcssには次が含まれます。

.nav-menu {
    width: 900px;
    margin-left: auto;
    margin-right: auto;
    background: url(bgcolor.jpg) repeat-x;
}

.nav-menu li {
float: left;
}

.nav-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.nav-menu li a {
background: url(bgcolor.jpg) repeat-x;
line-height: 36px;
height: 40px;
float: left;
width: 9em;
border-top: 1px solid #01607E;
border-right: 1px solid #01607E;
border-bottom: 1px solid #01607E;
color: white;
font-family: "Lucida Sans";
font-size: 10pt;
text-decoration: none;
text-align: center;
}

ただし、div全体の背後にbgcolor.jpgを表示するのではなく、while divの背後ではなく、(li)ボックスの背後に表示しています。 誰もが問題がここにあるものを見ることができますか?

ご協力いただきありがとうございます(問題に関する詳細な説明が必要な場合はお問い合わせください。回答を編集します)

2 Answer


1


フローティング問題のように聞こえます。 これを試して:

.nav-menu {
    width: 900px;
    margin-left: auto;
    margin-right: auto;
    background: url(bgcolor.jpg) repeat-x;
    overflow:hidden;
}

それでもうまくいかない場合:

.nav-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
    overflow:hidden;
}


1


高さはリストアイテムから継承されないため、コンテナdivは折りたたみます。 ulの後にクリアを追加します。

            Services
            About us
            Tell a friend
            Mission
            Contact us