css - 奇怪的位置：Mac webkit 浏览器上的绝对行为

Question

我正在尝试通过执行以下操作在菜单项旁边放置一个复选标记：

#userInfo div.dropDownContent p span
{
    position: absolute;
    margin-left: -20px;
}

段落内的 span 是绝对定位的，以保持菜单项文本的居中，否则复选标记与文本一起居中，它看起来很糟糕。

正如您在这个jsFiddle中看到的那样，复选标记在您的普通 Windows 浏览器中看起来不错，但是 Mac 和 iPad 上的 Safari（甚至可能是 Mac 上的 Chrome）在菜单外显示复选标记，我无能为力它甚至移动一个像素。

有谁知道我做错了什么？它是一个 webkit 错误吗？谢谢。

score 0 · Accepted Answer

我确实在 Safari 中看到了这种奇怪的行为，我真的无法解释为什么它只出现在那个浏览器中。

话虽如此，这个更新的小提琴应该告诉你什么对我有用。

基本上，我没有绝对定位跨度，而是使用相对定位并将其设置为左 -20px，如下所示：

#userInfo div.dropDownContent p span
{
    position: relative;
    left: -20px;
}

1 回答 1