Jeet.gs

Question

에서 col() 및 span()을 깨는 테두리 jeet.gs에서 span() 또는 col()을 사용하여 레이아웃 된 요소에 테두리를 추가하면 각 요소가 부모 컨테이너에 비해 너무 넓어집니다.

해결 방법이 있습니까?

코드 in의 몇 가지 예입니다.

http://codepen.io/aaaaargZombies/pen/yybYMZ

http://codepen.io/aaaaargZombies/pen/WbjQpK

---

<section> 
    <div>block1</div> 
    <div>block2</div> 
    <div>block3</div> 
    <div>block4</div> 
    <div>block5</div> 
    <div>block6</div> 
</section> 

---

edit() 

section 
    center(800px) 
    text-align: center 
div 
    span(1/3, cycle: 3) 
    margin-top: 5px 
    margin-bottom: 5px 

---

edit() 

section 
    center(800px) 
    text-align: center 
div 
    span(1/3, cycle: 3) 
    margin-top: 5px 
    margin-bottom: 5px 
    border 1px dashed red 

Answer 1

글쎄, 그건 그 div의의 시간 때문에 표준 상자 모델 및 테두리 폭은 너비에 포함되지 않습니다 (33. (3) %). 당신이 그들에게 box-sizing: border-box를 주면 모두 괜찮을 것입니다.