CSSで一定のピクセルサイズ

Question

スクロールバーの右側に余分なパディングを追加しようとしていますが、ブラウザウィンドウ（ctrl + =とctrl + - ）をズームすると、パディングの実際のピクセル幅が大きくなり縮小しますそれに応じて（私がemで指定したかのように）。コンテナのrightプロパティは、0.5ems（8/16 = 0.5）ではなく、正確に8ピクセルにしたいと思います。

設定する方法はありtop、bottom、left、およびフォントサイズ（私がしなければならない場合、私はJavaScriptを使用して気にしない）に依存して変化しない固定値にright CSSプロパティ？ここで

は私のCSSです：

#page-bg 
{ 
    background-color: #FFFFFF; 
    padding: 0px; 
    border-width: 2px; 
    border-radius: 2em; 
    position: absolute; 
    top: 1em; 
    left: 10%; 
    right: 10%; 
    bottom: 0px; 
    overflow: hidden; 
    z-index: 0; 
} 

#page-content 
{ 
    overflow: scroll; 
    position: absolute; 
    top: 8px; /* these are what I'm talking about */ 
    left: 8px; 
    right: 8px; 
    bottom: 8px; 
    z-index: 1; 
} 

Answer 1

あなたがズームしても、一定の「パディング幅」を維持するには、JavaScriptを使用してズームレベルを確認する必要があります。

それは可能性の一種だが、それが信頼できないですので、それは完全にそれ価値はありません、以下を参照してください。How to detect page zoom level in all modern browsers?

はたぶん同じことを達成するためのより良い方法があります - あなたがこれまで持っているもののjsFiddleデモを投稿する必要があります。

Answer 2

ほとんどのブラウザは、ページの解像度を実質的に変更するように見えます。この変更はjavascriptとcssの制御外です。短い答えはあなたができないことです。あなたが仕事をする1つのブラウザを見つけたら、標準と一貫性とそれがどのブラウザ上でどのように見えるかを決める必要があります。 HTML、CSS、javascript arntはこのタイプのコントロール用に作られました