定位和 浮动有什么问题吗？

Question

我有：

.event {
    float:left;
    position:relative;
    top: 50px;
    width: 100%;
    height: 100px;
    background-color: #FFFFFF;
    border-top: 1px solid #D6D6D6;
    border-bottom: 1px solid #D6D6D6;
}

它对我喜欢Firefox和Safari的作品有效。主要浮动在另一个元素上，但是相对于另一个元素偏移。我知道我可以为浮点数使用margin-top:50px，但是无论出于何种原因，top对我来说在语义上都更具意义。

Answer 1

[我发现有时有时需要float：left和position：relative，因为float的div包含使用position：absolute的元素。

“” position：relative“确保子元素在其自己的div中正确放置。如果父母中没有“亲戚”，他们将被安置在外面。

Answer 2

首先，在可能的情况下，我尽量不要将浮点数和相对/绝对位置结合在一起。只是因为增加了复杂性，并增加了跨浏览器问题的可能性。

第二，浮点数上有position: relative的有效用例。最明显的是使用relative+absolute positioning（其中float的内部元素相对于容器是绝对定位的。）>

这似乎不是您要执行的操作，因此建议您使用margin-top。这样，您可能会少一些头痛。话虽这么说，我什至不确定top: 50是否会按照您的期望在这里进行。

Answer 3

使用top时，还必须定位包含

Answer 4

没错。 float指的是元素将要呈现的流。position指的是此元素相对于其锚定的锚元素。如果它们是互斥的，则W3C建议将可能的选项合并为一个属性。

Answer 5

错误的主意，因为它的位置仍在同一位置，但是您将其从其原始位置偏移，并且will

Answer 6

您的操作方式没有“错”。在许多情况下，这可能被认为是“正确”的方法。