液体布局:避免由于垂直滚动条而导致的体宽变化

Nil*_*esh 12 html css

我为我的网站实施了液体布局.我已将body标签的宽度设置为100%.

<html>
<head>
</head>

<body>
    <div id="container">
        some content
    </div>
</body>
Run Code Online (Sandbox Code Playgroud)

body
{
   margin: 0;
   padding: 0;
   width: 100%;
}
Run Code Online (Sandbox Code Playgroud)

对于某些页面,将显示垂直滚动条.因为身体标签宽度减少了16px.我需要设置体宽,使滚动条的显示不会影响它.
我试过跟随,但它不适用于FF9.:

 body{
    width: -moz-calc(100% - 16px);
}

任何人都可以提出一种方法来实现这一目标吗

Jam*_*xon 5

解决此问题的一种方法是确保始终存在滚动条.然后,您可以放心地对页面进行样式设置,确保它们不会左右移动.

html,body
{
 height:101%;
}
Run Code Online (Sandbox Code Playgroud)

你也可以这样做:

html {
       overflow-y: scroll;
}
Run Code Online (Sandbox Code Playgroud)

(我不认为溢出方法适用于Opera)