오버로드 된 너비로 div를 배치합니다.

Question

div가 Container이고 너비가 100 % 인 Div가 있습니다. 픽셀 단위의 실제 너비가 한 사용자에서 다른 사용자로 변경 될 수 있습니다. 그 Container 내부, 나는 다음과 같은 값을 각각 10 상자를 가지고 :

width:8%; 
margin-left:1%; 
margin-right:1%; 
border:1px solid #000000; 
float:left; 

그 값을, 그것은 바로이 같은 렌더링해야합니까?

은 사실이 아니다. 상자는 (x 1 픽셀) 8 % 폭을 공간에 2 % 폭 밖으로 공간 (여백) 때문에 국경선을 가지고 모든 상자가 10 % 폭 + 2 픽셀

당신이 해상도로 재생 상자가 두 번째 줄로 확장되는 것을 볼 수 있으며 다음과 같이 나타납니다.

이 레이아웃을 어떻게 수정합니까?

외부 상자의 테두리를 설정하는 상자 안에 다른 상자를 배치하는 방법에 대해 생각했지만 꽤 잘 작동하지 않습니다.

Answer 1

나는 이것을 위해 jsfiddle을 만들었습니다. 각 내부 상자에 새 div를 추가하고 다음 속성을 설정하면 문제가 해결됩니다. (열쇠는 바깥 상자에서 바깥 상자로 테두리를 이동하는 것이 었습니다.)

width: 100%; 
height:100%; 
border: 1px solid #000000;