너비가 100 % 인 여분의 픽셀

너비가 680 픽셀 인 텍스트 영역이 있습니다. 이것은 백분율을 사용하여 유동적으로 만들어야합니다.너비가 100 % 인 여분의 픽셀

백분율은 완벽한 100 % 너비를 만들지 만 1 픽셀을 더 많이 렌더링해야합니다.

2012-04-02 markvandencorput

텍스트 영역은 유체 방법은 부모가 결국 텍스트 영역도 가고 고정 폭을 가지고있다 이후 난 정말이 표시되지 않습니다 고정 너비입니다. 한 픽셀 차이에 대해서는 브라우저가 픽셀에 대한 백분율로 패딩을 계산 한 후 소수점 이하 자릿수를 반올림하여 오웬을 알기 때문에 발생합니다. –

부모는 내가 만든이 예제에서 "고정 된"소유자 일뿐입니다. 왜 그들은 자릿수를 반올림합니까? – markvandencorput

94.10029498525074 % of 680 px = 639.88.2006이지만 브라우저는 640px 대신 639px가됩니다. 상자 모델을 변경하지 않으면 너비가 너비의 일부로 계산되기 때문에 백분율이 100으로 완벽하지 않습니다. –

그리고이 무슨 문제가 될 것입니다 :

textarea { 
border: 1px solid #333333; 
background: #ececec; 
margin: 0; 
outline: 0; 
height: 100px; 
padding: 20px; /* */ 
width: 640px; /* 680px - 2 * 20 */ 
resize: none; }

출처

2012-04-02 11:04:54

예를 들어 작은 div에 넣을 때 비율을 필요로하므로 비율을 조정해야합니다. – markvandencorput

좋아요, 문제는 텍스트 영역의 테두리입니다. % 대신 px로 표시되기 때문에 바깥 쪽 div의 크기를 변경할 때 문제가되지 않습니다. –

내부 요소에서 외부 요소로 테두리를 이동합니다. 여기에서 예제를 수정했습니다. http://jsfiddle.net/b8yxP/ –

너비가 100 % 인 여분의 픽셀

답변

관련 문제