2

次の CSS コードを使用して、Web サイト用のコンテナー div があります。

.container {
    width: 1020px;
    background-color:transparent;
    margin: 0 auto;
}

上に示すように、幅は固定されています。コンテナには、ナビゲーションバーと、それら<hr>を分離するためにプロパティを使用しているセクションがありますが、私が抱えている問題は、この時間に 100% の幅を与えても、私のコンテナですが、ページ全体に展開したいです。

それを管理する方法はありますか？前もって感謝します。

4

2 に答える 2

2

要素の幅は、相対サイズが指定されている場合、その親要素に相対的です。この場合、hr要素widthを別の親に対して相対的にする方法はありません。

ただし、必要に応じて、 より大きい幅を100%指定してから、中央に負のマージンを使用できます。

​div {
    width: 50%;
    margin: 0 auto;
    border: 1px solid #f90;
}

​div hr {
    width: 190%;
    margin-left: -45%;
}​

<div id="a">
    <hr />
</div>​

JS Fiddle の概念実証。

于 2012-06-11T19:12:45.637 に答える
0

この場合、コンテナに幅やマージンを設定するのではなく、コンテンツ自体に設定する方がよいと思います。そのコンテナ内に単純な HTML 構造がある場合は簡単です。

HTML

<div id="container">
    <p>Lorem ipsum dolor sit amet</p>
    <hr>
    <p>Lorem ipsum dolor sit amet</p>
    <hr>
    <p>Lorem ipsum dolor sit amet</p>
    <hr>
    <p>Lorem ipsum dolor sit amet</p>
</div>

CSS

#container p { width: 500px; margin: 0 auto; }

http://jsfiddle.net/cEGNb/1/

于 2012-06-11T19:14:40.280 に答える