1. ホーム
  2. css

[解決済み】CSSで子DIVの幅を親DIVより広くする方法はありますか?

2022-04-01 18:55:22

質問

親コンテナDIVの中に、親より幅の広い子DIVを持つ方法はありますか?子DIVはブラウザのビューポートと同じ幅である必要があります。

以下の例をご覧ください。

子DIV は親 div の子として留まります。子 div に任意の負のマージンを設定して幅を広げることができるのは知っていますが、基本的にブラウザの幅を 100% にする方法を見つけることができません。

これができるのは知っています。

.child-div{
    margin-left: -100px;
    margin-right: -100px;
}

しかし、私は子供が動的であるブラウザと同じ幅になるようにする必要があります。

更新情報

ご回答ありがとうございます。今のところ、子DIVのposition: absoluteにして、leftとrightのプロパティを0にするのが一番近い答えのようです。

次の問題は、親がposition: relativeであることです。つまり、leftとrightのプロパティはブラウザではなく、親divに対する相対的なものです。 jsfiddle.net/v2Tja/2

他のすべてを台無しにすることなく、親からの相対的な位置を削除することができないのです。

どうすればいいですか?

絶対位置決めを使用する

.child-div {
    position:absolute;
    left:0;
    right:0;
}