如何设置宽度：100％以匹配第一个容器

Question

嘿，我希望第3个容器的宽度与第一个容器的宽度相同。但是，当我将第三个容器设置为width：100％时，宽度与第二个容器相同。我将显示示例代码。

<div id="container1" style="width:940px;"
    <div id="container2" style="width:480px;"
         <div id="container3" style="width:100%"</div>
    </div>
</div>

我希望第三个容器的宽度与第一个容器的宽度相同，并且我想使用％声明我的第三个容器。

Answer 1

这是我的真实代码：您可以在网站ibb.co/k8CLsSW上看到其外观图像。我希望下拉菜单具有完整的页面宽度。

y['shared']

Answer 2

我建议您将HTML和CSS代码分成单独的文件。但是，您忘记在所有容器上添加一个右括号。我提供了两套代码，一套基于HTML，一套基于CSS。

我添加了单独的边框颜色，因此您可以看到哪个DIV可以做什么，您可以删除它们。

<style>
#container1 {
width: 940px;
border: 1px solid red;
}

#container2 {
width: 480px;
height: auto;
border: 1px solid blue;
}

#container3 {
width: 940px;
border: 1px solid green;
}
</style>

<div id="container1">
Container 1
<div>
    <div id="container2">
    Container 2
    </div>
         <div id="container3">
         Container 3
         </div>

#container1 {
width: 940px;
border: 1px solid red;
}

#container2 {
width: 480px;
height: auto;
border: 1px solid blue;
}

#container3 {
width: 940px;
border: 1px solid green;
}

<div id="container1">
Container 1
</div>
    <div id="container2">
    Container 2
    </div>
         <div id="container3">
         Container 3
         </div>