将3个内容框彼此相邻放置

Question

我有一个名为content的主容器，在该容器中我有3个div。现在我希望它们彼此相邻，如下所示：X X X.在教程中我读到我应该将它们全部浮动到左边。这适用于前2个，但第三个永远不会出现。我确定路径是正确的，因为当我把它作为第二道时它确实出现了。有人可以帮帮我吗？

HTML

<div id="content"
    <div id="about_us"></div>
    <div id="our_services"></div>
    <div id="contact_us"></div>
</div>

CSS

#content {
width: 1200px;
height: 254px;
}

#about_us {
background-image: url(../website/images/about_benshore.png);
width: 307px;
height: 183px;
float: left;
margin-top: 26px;
margin-left: 119px;
}

#our_services {
background-image: url(../website/images/our_services.png);
width: 308px;
height: 184px;
float: left;
margin-top: 26px;
margin-left: 23px;
}

#contact_us {
background-image: url(../website/images/contact_us.png);
width: 307px;
height: 183px;
float: left;
margin-top: 26px;
margin-left: 23px;
}

Answer 1

尝试将overflow：auto添加到#content。

同时确保元素的宽度加上各自的边距不超过#content的宽度。