1

我创建了一个 div 来包含标签，标签是带有“display：inline-block，float：left”的跨度。标签在我的项目中无处不在，除了当我使用 php 编写一个 div“tag_block”并将标签跨度放在里面时，奇怪的是对于被渲染的第一个元素，跨度居中，然后当我向下滚动时其他元素，定位慢慢向右移动，停在右边，偶尔跳动一下。

这听起来像浏览器问题吗？我很困惑！

“float：left”似乎被随标签块打印的每个元素改变的任意东西所取代。

<div class="tag_block">
    <span class="tag">Tag0</span>
    <span class="tag">Tag1</span>
</div>

这是我的 JSFiddle 代码中的注释（http://jsfiddle.net/livvyjeffs/4uAp4/5/）

所以我真的把这个问题最小化了，出于某种原因，顶部块内的文本会影响跨度在它下面的块中开始显示的位置。有任何想法吗？

4

2 回答 2

0

既然你正在使用display: inline-block你不应该漂浮。浮点数适用于块级元素。这可能是您的问题的原因。display: inline-block在技​​术上与反正做同样的事情，float: left因为它将元素内联放置在彼此旁边。

另一个问题可能是您的浮点数堆叠在tag_blockdiv 内。如果您浮动 div 内的所有元素，它不会自行清除。如果是这种情况，您可以让下一组元素与前者对接。您可以使用clearfix解决此问题。将该代码添加到您的 CSS 并将 clearfix 类添加到父元素tag_block。同样，您应该能够通过简单地移除浮动来避免这种情况。

于 2013-11-11T18:28:46.833 回答
0

呼...问题是容器中的一个 div 有问题的 div 超出了框的边界，导致它下面的 div 的对齐（问题 div）依赖于它上面的那个。

这是突出显示的问题。

和解决方案，将问题 div 设置为 height: 0 （或不与边界重叠的东西）。

.poster{
     height: 0;
}

堆栈礼仪？我试图删除我的帖子而不是回答我自己的问题。好像我的问题现在卡在这里了。感谢所有的帮助！

于 2013-11-11T20:47:06.363 回答