2014-11-15 1 views
0

나는 내 웹 사이트의 반응 형 페이지에서 작업 중입니다. 다음은 내가 만들고있는 모형입니다. http://dariostefanutto.com/test-work-page고정 비율로 부동 div에 테두리 추가

페이지가 고정 된 종횡비의 부동 div로 채워집니다. 그것들은 모두 4 : 3 비율 그리드를 기반으로하며, 모든 div의 아래쪽 패딩에 퍼센트를 부여합니다 (예 : 4 : 3 종횡비의 div의 경우 75 %). 현재 div 사이에는 공백이 없지만 모든 공백에 1px의 공백을 추가하고 싶습니다.

이제는 패딩 픽셀을 추가하면 div의 높이가 바뀌고 더 작은 div가 세로로 쌓인 행에서 그리드가 깨집니다. 왜냐하면 테두리의 2 배 (4 픽셀 총계에서), 큰 div의 2px 대.

div의 높이를 변경하지 않고 간격을 추가하는 방법이 있습니까? 감사합니다.

추신 : 웹 플로우를 사용하여 코드를 작성하고 있기 때문에 실제로 코드를 게시 할 수 없습니다. [박스 크기 : 경계 박스 (https://developer.mozilla.org/en-US

+2

당신이 사용할 수있는 실행/docs/Web/CSS/상자 크기 조정). – emmanuel

+0

"현재 div 사이에는 공백이 없지만 모든 항목에 1px의 공백을 추가하고 싶습니다." 마진을 의미합니까? –

+0

div의 너비가 변경되지 않기 때문에 채우기를 시도했습니다. 그렇지 않으면 격자가 끊어집니다. –

답변