2014-07-23 2 views
0

는 폭과 마진이 100 % (22.15 % * 3 + 22.15 %를 차지는 안전 DIV

#container { 
    width: 500px; 
    background-color:red; 
    overflow: auto; 
} 
#container div { 
    float: left; 
    width: 22.15%; 
    margin-right: 3.8%; 
    height: 100px; 
    background-color: blue; 
    color:white; 
} 
#container div:last-child { 
    margin-right:0; 
} 

<div id=container> 
    <div>1</div> 
    <div>2</div> 
    <div>3</div> 
    <div>4</div> 
</div> 

아래 코드와 CSS를 고려 사용할 때 100 % 폭을 점유하는 것입니다). 이것을하기에 안전한 크로스 브라우저인가? 아니면 안전을 위해 98 % 만 점유해야합니까?

데모 : ( 패딩, 테두리와 마진을 포함 ) http://jsfiddle.net/NSndR/

답변

1

예, 100 % %의 폭 (도 Internet Explorer를 무엇을 추측) 브라우저에서 안전합니다. 또한 백분율 값은 this SO 질문에서 논의 된대로 작동해야합니다.

1

대부분 그렇습니다. 국경과 여백은 100 %에 포함되지 않습니다. 예를 들어, div가 100 %이지만 2px 여백이있는 경우 실제로는 100 % + 4px ... 테두리는 동일합니다.