2011-07-29 10 views
1

CSS 그리드 시스템을 사용하고 있고 페이지 구성 요소가 테두리 반경을 가진 그리드에 스냅 된 div라고 가정 해보십시오.CSS 그리드 및 중첩 요소

이러한 구성 요소를 중첩하려면 부모 구성 요소와 하위 구성 요소 사이의 거리가 적어도 열 너비 이상이어야합니다. 맞습니까?

거리를 줄이면 어떨까요?

최대 3 또는 4 개의 레벨을 중첩하려면 어떻게해야합니까?

아이디어가 있으십니까? 바로 -

감사

+0

그리드에도 정렬해야합니까? 일반적으로 그리드 시스템은 최상위 페이지 구조에 가장 유용합니다. 또한 바깥 쪽 div에 중첩 된 div가 있습니까? – Wylie

답변

0

당신이 둥지 이러한 구성 요소를하고자하는 경우, 부모 와 하위 구성 요소 사이의 거리가 적어도 열 너비해야?

왜 테두리 반지름을 사용하여 격자의 블록/열을 정렬합니까? 여백을 사용해서는 안됩니까?

그리드에 배치하려면 모든 그리드 열에 거터가 있어야합니다. CSS 그리드 프레임 워크에서 찾고있는 내용은 1KB Grid과 매우 비슷합니다.

유연성을 원하는 경우 Variable Grid System을 사용할 수 있습니다. 당신이 제안하고있는 것부터, 커스텀 그리드를 사용하거나 CSS 그리드 프레임 워크를 만들 필요는 없습니다.

+0

아니요, 죄송합니다.이 구성 요소에는 테두리 (일반적으로 1px)가있을 수도 있고 없을 수도 있으므로 border-radius에 대해 언급했습니다. 그리드 간격. – stephenwil

+0

테두리는 요소의 치수를 벗어난 색상을 제공하고 테두리가있는 div는 경계를 과시 할 수있는 충분한 공간이없는 경우 다른 div를 밀어내는 경향이 있습니다. 당신이 할 수있는 일은 모든 것에 경계를주고, 당신이 보이는 (보이지 않는) 테두리를 원하지 않는 아이템들에 대해서는 경계를 투명하게 만들 수 있습니다. – desbest