CSS의 상수 픽셀 크기

스크롤 막대의 오른쪽에 추가 패딩을 추가하려고하지만 브라우저 창을 Ctrl + = 및 Ctrl + -로 확대하면 패딩의 실제 픽셀 너비가 커지고 축소됩니다 따라서 (마치 내가 em에서 지정했듯이). 컨테이너의 right 속성이 0.5ems (8/16 = 0.5)가 아닌 정확히 8 픽셀이되도록하겠습니다.CSS의 상수 픽셀 크기

설정하는 방법이있는 top, bottom, left 및 글꼴 크기 (I가있는 경우 나 자바 스크립트를 사용하여 상관하지 않습니다)에 따라 변경되지 않는 고정 된 값으로 right 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; 
}

출처

2011-07-27 D K

질문에 CSS를 추가 할 수 있습니까? – m4tt1mus

확대/축소 기능은 브라우저마다 다르게 작동합니다. 일부는 글꼴 크기 (레이아웃을 적용 할 수있는 크기) 만 확대하고, 일부는 전체 레이아웃 (이미지 포함)을 확대하여 효과적인 화면 크기가 축소되도록합니다. (일부는 확대/축소를 전혀 지원하지 않습니다.) –

@ m4tt1mus : 이제 코드를 추가했습니다. –

당신이 확대하더라도, 당신은 자바 스크립트를 사용하여 줌 레벨을 찾을 필요가 고정 된 "패딩 폭을"유지하려면 :

여기 내 CSS입니다.

그것은 가능의 일종하지만 신뢰할 수 있기 때문에 그것은 완전히 그럴 가치가 없어, 참조 : How to detect page zoom level in all modern browsers?는

어쩌면 같은 일을 달성하기 위해 더 나은 방법이 - 당신은 당신이 지금까지 무엇을의 jsFiddle 데모를 게시해야한다.

출처

2011-07-27 22:36:23 thirtydot

대부분의 브라우저는 페이지 해상도를 사실상 변경하는 것으로 보입니다. 이 변경은 javascript 및 css의 제어 범위를 벗어납니다. 짧은 대답은 당신이 할 수 없다는 것과 작동하는 하나의 브라우저를 찾으면 표준과 일관성 사이에서 결정해야하며 한 브라우저에서 어떻게 보이는지를 결정해야합니다. HTML, CSS 및 자바 스크립트 arnt 컨트롤 의이 유형을 위해 만든

출처

2011-07-27 23:06:46 Will03uk

CSS의 상수 픽셀 크기

답변

관련 문제