DOM 요소의 너비가 정수가 아니어도됩니까?

JavaScript로 div 요소가 정렬 된 페이지가 하나 있습니다. 자바 스크립트는 모든 DIV 요소 '폭가 될 수있는 최대 의 offsetWidth 설정, 최대 의 offsetWidth을 찾기 위해 DIV 요소 세트를 확인합니다. 대부분의 브라우저와 로케일에서 완벽하게 작동하지만 Mac의 Firefox에서는 프랑스 - 프랑스에서 작동하지 않습니다. 이 경우 div의 내용이 줄 바꿈됩니다.DOM 요소의 너비가 정수가 아니어도됩니까?

<div id="divFoo"> 
    Heure de d&#233;but : 
</div>

위의 HTML에는 코드 보고서 "79"아래에 있습니다.

javascript:alert(document.getElementById('divFoo').offsetWidth);

그러나 코드 보고서 "79.1333px"아래.

는

javascript:alert(window.getComputedStyle(document.getElementById('divFoo'),null).width))

79.1333 (79) 사이의 간격은 인라인 스타일 잘못된 폭 세트를 만든다. 내가하는 데 사용

는 의 offsetWidth 및 폭 항상 정수되어야한다고 생각했다. 어떤 방법으로도 만들 수 있습니까 offsetWidth 제대로 돌아갈 수 있습니까?

출처

2009-03-12 Morgan Cheng

사용자 에이전트가 결정한 CSS 스타일 규칙 (getComputedStyle() 또는 Renzo Kooi의 getStyle())과 실제 계산 된 너비 (픽셀 단위) 사이에는 차이가 있습니다.

이것은 부분적으로 픽셀 값이 CSS에서 가능하지만 사용자 에이전트가 부분 픽셀을 렌더링하는 방법을 선택해야하기 때문에 발생합니다 (현재, 나는 모두 위아래로 반올림한다고 생각하지만 특히 매우 일관성이 없습니다. 퍼센트를 픽셀로 변환 [here 참조]).

특히 사용자 에이전트가 전체 페이지 확대를 구현할 때 이러한 차이가 존재해야합니다. 사파리 4 베타 한 단계 확대

가

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
    <title>Fractional pixels</title> 
    <style type="text/css" media="screen"> 
     #fractional { 
      width: 17.5px; 
      height: 16.1333px; 
      background: red; 
     } 
    </style> 
</head> 
<body> 
    <div id="fractional"></div> 
</body> 
</html>

상기 CSS 폭 17.5px 및 높이 16.1333px으로보고된다 : 예를 들어

는 I이 함께 테스트 케이스를 만들었다. 그러나 offsetWidth은 21 개의 장치 픽셀이며 offsetHeight은 19 개의 장치 픽셀입니다.

이야기의 도덕적 의미는 간단히 말해 요소의 실제 치수를 일치 시키려면 정수가 아닌 경우에도 CSS 값을 그대로 사용하는 것이 가장 좋습니다.

출처

2009-03-12 06:43:40 eyelidlessness

DOM 요소의 너비가 정수가 아니어도됩니까?

답변

관련 문제