CSS获取不同显示器尺寸的div标签的确切位置

我正在试图制作一个网站，并且正在制作它我在两台显示器上测试了它：我的1366 x 768笔记本电脑和1080p显示器已连接到它。我想对齐div标签总是停留在同一个地方，我用这：CSS获取不同显示器尺寸的div标签的确切位置

nav{ 
    position:absolute; 
    left: 40%; 
    top: 60% 
    }

然而，这似乎并没有把工作做好。它在一台显示器上正常工作，但不是另一台。我会假设，如果我使用百分比而不是像素，那么它会起作用。任何意见什么是错误的在这里将非常感激。

来源

2014-06-21 Lukasz Medza

你说的 '同一个地方' 是什么意思？关于什么，祖先元素，浏览器的视口，还有其他的东西？ –

使用position:absolute;所有固定元素将基于<html>。

这意味着它将剩下40％的任何监视器使用。更大的宽度和位置将会改变。

要解决这个问题，您需要一个包含position: relative的父容器。

现在任何与position:absolute内部的父元素pos:rel将相对于此元素和父将仍然遵循文档流。

简而言之：

//html 
<body> 
    <element> 
     <nav> 
     </nav> 
    </element> 
</body> 
//css 
element { 
    position:reletive; 
} 
nav{ 
    position:absolute; 
    left: 40%; 
    top: 60% 
}

来源

2014-06-21 20:50:35

您的div has class = nav or id = nav？在这种情况下，前缀nav在您的css中，.在类中，#中包含id。

如果你想的div是完全在同一个地方相对于浏览器的顶部和左侧，切换回px

%将是相对于你的浏览器大小。

来源

2014-06-21 20:49:37

我想你想的元素相对于浏览器窗口的位置（这是我假设你想，当你在谈论显示器尺寸做的。也就是在全屏浏览器。

在这种情况下，你要使用

nav{ 
    position:fixed; 
    left: 40%; 
    top:60%; 
}

这破坏了元素出流动的一般规则，并将其移动相对于视。

我不知道针对任何CSS规则相对于OS桌面空间的窗口位置

来源

2014-06-21 20:49:46 John

CSS获取不同显示器尺寸的div标签的确切位置

回答

相关问题