Safari 中的项目未正确对齐

Question

我的操作栏中的一个元素不会留在 Safari 和 ipad 上。它甚至不规则地上下移动（如下面两张不同的图片所示）。由于 ipad 上的 chrome 是基于 safari webkit 引擎构建的，因此应该与此有关。

我似乎找不到解决方案。

在下面的图片中，您可以看到它以 div.profile 开头。

nav .profile {
    height: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    top: 0;
}

还有更多代码，但我放了 JSfiddle。 Bootstrap 3 被使用，我正在使用 flexbox，可能值得一提。

谁知道更多

Answer 1

将此添加到您的 css。

nav a.icon, nav .profile, nav .profile div {
    display: inline-block;
    vertical-align: top;
}

items not aligning correctly in safari