구분 기호 그리드 열 사이

Question

어떻게 그리드 열 사이에 구분 기호를 추가 할 수 있습니다. 나는 테두리를 추가하려고 시도하고 항상 레이아웃을 어겼습니다. 첨부 된 그림을 잘 보아주십시오. 편집

는보고 여기

http://burnfatweightlossblog.com/aiu/junaid/testhtml/

코드가

<div class="container_12"> 
    <div id="footer"> 
    <div class="alpha grid_3 dabox"> </div> 
    <!-- Box 1--> 
    <div class="grid_3 dabox"> </div> 
    <!-- Box 2--> 
    <div class="grid_3 dabox"> </div> 
    <!-- Box 3--> 
    <div class="omega grid_3 dabox"> </div> 
    <!-- Box 4--> 
    </div> 
    <!-- footer--> 
</div> 

gtamil가이 추가됩니다 말하는 것처럼

Answer 1

추가 테두리 추가 x 1 픽셀을 추가, 그래서 대신 그리드 컬럼에 경계를 추가하는 레이아웃 나누기,

Answer 2

... 그 안에 사업부를 추가하는 시도하고 그것에 경계를 제공 각 열의 경계의 폭. 그는 2) 배경 이미지가 아닌 실제 국경

옵션 3을 사용) 1 픽셀을 경계 3이있는 각 열에서 1 x 1 픽셀을 제거 말하는 것처럼 일반적으로부터 내 취향입니다) 1 할 : 그래서 그들을 볼로 yuor 옵션은 보통 나는 칸막이가 같은 높이가 되길 원합니다. 세로로 반복되는 배치 컨테이너 (열 div 수 없습니다) 배경 이미지를 것입니다. 이 방법을 사용하고 분할 자의 높이가 같지 않은 경우 동일한 이미지를 열에 추가 할 수 있습니다.

Answer 3

장소 그리드 사업부 내부의 콘텐츠 래퍼 div의

HTML : CSS

<div class="grid_4"> 
    <div class="columnDivider"> 
     contents here 
    </div> 
</div> 

:

.columnDivider { 
    border-right: 1px solid #DEDEDE; 
    margin-right:-10px; /* size of gutter */ 
    padding-right:10px; /* size of gutter */ 
}