Question

我是html和css的新手。我用css编写了一个html页面，但很困惑。

我使用了这个css代码

#container {
background: #000000;
width: 500px;
margin: auto;
}
#left {
background: #FF0000;
width: 200px;
float: left;
}
#right {
background: #0000FF;
width: 200px;
float: right;
}

和这个HTML代码

<div id="container">
<div id="left">This is left</div>
<div id="right">This is right</div>
</div>

但是我没有在#container中指定的黑色背景。你能帮帮我吗？我希望背景在我写内容时自动移动。在具有id容器的div之间。

Answer 1

这是因为您使用Float作为内部div并且容器不包含任何文本，

试试这个

<div id="container">


    hello <br>
<div id="left">This is left</div>
<div id="right">This is right</div>
<br><br>

    </div>

Answer 2

将#container设置为

float: left;

或

display:inline-block;

Click here用于实例。

Answer 3

这对你有用

#container {border:2px solid #cccccc;
height:50px;
background-color: #000000;
width: 500px;
margin: auto;
}

div的背景不符合内容

3 个答案: