Question

我有width :100%的几个div。当我运行代码时，我在div和页面的两侧（左右）之间得到空格。

这是我的HTML代码：

<div id="main_pics" class="container">
<!-- photos here -->

</div>

<div id="other1" class="container">

</div>

<div id="other2" class="container">
</div>

这是我的css代码：

#main_pics{
margin-top: 57px;
/*background-color: rgb(224,224,224);*/
/*border: 1px solid black;*/
}

.container{
width: 100%;
height: 500px;
background-color: white;
}

#other1{
background-color: rgb(224,224,224);
width: 100%;
}

#other2{
width: 100%;
background-color:fuchsia;
}

我将#main_pics设置为margin-top: 57px，因为它上面有一个导航栏。

有谁知道问题是什么？

Answer 1

试试这个CSS：

body, html{
    margin: 0;
    padding: 0;
}

Answer 2

这是默认的body元素margin，您可以使用CSS删除：

body { margin: 0; }

div和页面之间的空格

2 个答案:

JSFiddle