Question

我有一个div中有一个div和1 H1标签的页面;

我给H1一个保证金，它给予整个div的保证金

为什么会这样？

以下是整个代码：

<style type="text/css">
<!--
* {
 margin: 0px;
 padding: 0px;
}
#wrapper {
 margin-right: auto;
 margin-left: auto;
 background-image: url(image-files/mockupV2.jpg);
 background-repeat: no-repeat;
 height: 555px;
 width: 1040px;
 background-position: center top;
}
#wrapper h1 {
 text-align: center;
 font-size: 72px;
 font-family: "Comic Sans MS", cursive;
 text-decoration: blink;
 color: #F07D00;
 background-color: #000;
 margin-right: 125px;
 margin-left: 125px;
 display: block;
 margin-top: 125px;
}
-->
</style>
</head>

<body>
<div id="wrapper"><h1>COMING SOON</h1>

</div>
</body>

Answer 1

问题

这是由margin collapse引起的：

“在本说明书中，表达式利润率下降意味着两个或两个以上方框的边距结合形成一个边缘。“

或更简单：

当垂直边距为两个时元素是感人的，只有边缘具有最大边际的元素价值将得到尊重，而元素的边距越小保证金价值将折叠为零。

解决方案

你可以通过以下方式修复它：

向您的#wrapper添加垂直填充。
为#wrapper添加边框。
暂停<h1>。

Answer 2

只需向overflow:hidden

添加#wrapper即可

这应该有效。

为什么我的保证金在整个div上？

2 个答案: