Html 不同屏幕尺寸上的不同div定位

我正在尝试写一个个人网站，我正在一个1366x768笔记本电脑屏幕上测试我的网站，但也连接了一个1920x1080显示器。我的div的布局在笔记本电脑上看起来非常完美，但是当我将网站移动到显示器上时，其中一个div标签喜欢稍微移动（这很奇怪，因为其他的看起来都很好）

下面是一张图片来说明我的问题：

我希望导航div的边框与字母k和d对齐，这在显示笔记本电脑显示器的顶部图像上效果很好，但正如您在div下方的图像上所看到的那样。红线表示实际对齐，绿线表示我希望它的外观

这是我对div的CSS：

nav{

    position: absolute;
    top: 60%;
    margin-left: 40%;
    margin-right: 20%;
    border: solid;

}

---

我的逻辑是，如果我使用百分比进行定位，那么div将适应不同的屏幕大小并保持固定在同一位置，但情况似乎并非如此。任何关于如何固定的想法都将非常感谢。

将导航与徽标放在同一div中（比如class.container）

---

现在只需相对于.container定位导航。它应该在任何分辨率上都在那里。

对不起，我的英语很糟糕，我正在练习（我希望已经理解了你的要求）

如果您想使用绝对位置，您应尝试以下方法： 将导航插入文本容器，然后使用此css

nav {
    position: absolute;
    top: "your percentage";
    left:0;
    right:0;
    margin:0 auto;
    border: solid;
}

---

这样，您可以始终将长方体居中（根据父容器）.

是否有一个定义了宽度的父div？不，整个事件由两个div组成，一个用于文本部分，另一个用于分隔的nav。这是绝对定位元素的预期行为，具有%的边距。1336上距离左侧20%的数字与1920不同。我建议不要绝对定位。相反广告使用硬块并使用marginsI我同意briansol的观点，如果您需要更好的解决方案，请提供此完整部分的更多HTML和CSS代码

nav {
    position: absolute;
    top: "your percentage";
    left:0;
    right:0;
    margin:0 auto;
    border: solid;
}