如何使元素不调整窗口大小/分辨率更改

我有一个简单的登录框，它位于页面中央（垂直和水平）。如何使元素不调整窗口大小/分辨率更改

在这里你可以找到DEMO吧：

http://encodable.com/uploaddemo/files/login.html

问题是，每次我调整浏览器窗口手动的div（#login-logout-box）的内容被调整大小，如果有人试图查看这个登录表单在浏览器窗口中，哪个高度低于380px，它应该向页面添加滚动条。但是atm而不是那个盒子只是被切断了。意思是在低分辨率下，这种形式是部分显示无法滚动的能力：S（尝试了几款手机--Iphone和Android 2.3）

但我不希望那个div可滚动，但整个页面。

我已经检查www和stackoverflow的可能的答案，但没有什么，也很抱歉，如果问题不清楚，我已经尽力描述它。

来源

2012-03-26 ProDraz

我不明白。如果你只是设置一个固定大小的元素，每当它溢出窗口时，滚动条就会自动出现......是不是你想要做的？ – Sparky 2012-03-26 14:59:08

@ Sparky672是的，正好。但是对于某些规则来说，它并不在Firefox和Opera中发生。 – ProDraz 2012-03-26 15:03:50

它也不适用于Safari。 – Sparky 2012-03-26 15:28:10

你的代码不应该在任何浏览器中工作。根据W3C Spec,“固定位置大于页面区域的框是剪辑”。

简单地改变position: fixed;到position: absolute;

#login-loguout-box { 
    width: 380px; 
    height: 380px; 
    position: absolute; 
    top: 45%; 
    left: 50%; 
    margin-left: -190px; 
    margin-top: -190px; 
    margin-bottom: 20px; 
    border: 2px solid #cacaca; 
}

Working Code

Full Screen Demo

来源

2012-03-26 15:36:15 Sparky

在css中使用overflow设置，例如，

overflow-x: auto; /* for horizontal scrolling*/ 
overflow-y: auto; /* for vertical scrolling */

来源

2012-03-26 14:18:37 scibuff

向其添加滚动条，为true。但是当我们不需要滚动条时，我不希望滚动条只在浏览器分辨率很小的时候才需要它们来显示整个表单。 – ProDraz 2012-03-26 14:32:39

如何使元素不调整窗口大小/分辨率更改

回答

相关问题