关于div嵌套的边距问题

菜鸟一枚,一个问题自己找了很久没有发现答案,无奈来请教各位大神。

HTML代码如下:
<div id="big">
    <div id="small">
    </div>
</div>

CSS代码如下:

big{

background-color: red;
height: 30px;

}

small{

background-color: gray;
height: 10px;

}

为何出现的效果small不是顶着夫级div呢?
clipboard.png

求教。

阅读 3.9k
3 个回答

请发完整代码以及使用的浏览器 我按照你的代码 `<!doctype html>
<html lang="en">
<head>

<meta charset="UTF-8">
<title>测试</title>
<style type="text/css">
#big{ background-color: red; height: 30px;}
#small{ background: gray;height: 10px;}
</style>

</head>
<body>

<div id="big">
    <div id="small">
    </div>
</div>

</body>
</html>` 测试效果是这样的图片描述

HTML代码如下:
<div id="big">
    <div id="small">
    </div>
</div>

这段格式有问题,打开编辑器,重新写一下就好了

<div id="big">
  <div id="small">
  </div>
</div>
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题