div 元素有边距答案

【问题标题】：div element has a margindiv 元素有边距
【发布时间】：2015-03-01 06:30:44
【问题描述】：

我已经构建了一个内容 div，其中包含另外三个具有

的 div

显示：内联块；

属性。其中一个包含另一个具有一些音频控件的 div 元素。正确的 div 有很大的余量！ Chrome 和 Firefox 不显示任何边距或填充。如果我删除#music 元素，一切正常。

感谢您的帮助

【问题讨论】：

尝试用栈 sn-p 显示相关代码。
您是否尝试过将display:block; 与float:left 一起使用？
把一些内容放到其他div里看看有什么区别。它是inline-blocks 中的vertical-align。无论如何，为什么不使用 flex-boxes？
内联块项目的默认对齐方式为baseline。您需要使用vertical-align:top。
@AlexeyTen 我现在正在发现弹性盒子。他们是了不起的。谢谢。

【解决方案1】：

因为您使用的是display: inline-block; 定义，所以您的内容默认与baseline 垂直对齐。

将此应用于您的 .frames 类：

vertical-align: top;

问题解决了。 ;)

【讨论】：

【解决方案2】：

如果您将float:left 添加到#music，它将得到修复_

建议在父元素上使用 clearfix 不会造成伤害：

.parent:after{
  display:table;
  content: "",
  clear:both
 }

【讨论】：