html - 漂浮物品:某些物品排成一排

所以，有一个相当标准的浮动设置。

<div class="container clearfix">
   <div class="item">Some content</div>
</div>

css

.item {
  float:left
  width: 30%;
  margin: 1.5%;
  background-color: #fff;
  border: 1px solid #929292;
}

也有adsense广告混入，但其大小由.item包含
问题是：其中一个项目（本应排在第一位的项目）单独位于容器的右侧，其余项目位于下一行，按原计划向左浮动。
这个问题可能出现过好几次，但我的搜索没有返回任何结果。我猜是关键词错了。
附笔
我试过改变宽度和边距。

最佳答案

一些浏览器将您的1.5%设置为2%。这可能是问题所在吗？因为那样的话，你就会有102%的总数，导致它破裂。
您也可以使用填充而不是边距，然后可以设置box-sizing: border-box;。如果您这样做，您的填充将包括在总宽度。
根据你的现场版本，以下是你的答案：
广告上的商品与你的其他商品有不同的高度，这就是为什么它们看起来很奇怪。你必须在广告后清除第一个项目上的浮动，或者确保所有项目的高度相同。

关于html - 漂浮物品:某些物品排成一排，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/29831777/