.views-view-grid에서 3 열 중 2 열 사이에 세로선을 추가하는 방법

Question

나는이 드루팔 (Drupal)에서 새로운 것이지만 내 처지를 설명하기 위해 최선을 다할 것입니다. 그리드 주변에 테두리가있는 사이트를 편집 중입니다. 내 그리드 주변의 경계를 해제하는 방법을 알아 냈습니다. 나는 1 열 사이에 단 하나의 수직선을 표시하려고합니다. & 2 열 사이에 1 개의 수직선 2 & 3. 나는 열의 한쪽면에 테두리를 두거나 열 사이의 세로 줄.

어느 쪽이든, 나는 내 CSS가 이런 일이 일어날만큼 충분히 잘 모른다. [1] : http://i.stack.imgur.com/hnNVO.jpg 다음

입니다 그것에 대한 내 현재있는 style.css 코드 :

.views-view-grid td { 
    border-color: #CCCCCC; 
    border-style: solid; 
    border-width: 0px; 
    width: 33%; 
    } 

    .views-view-grid tr { 
    border-left: 0px solid #CCCCCC; 
    border-right: 0px solid #CCCCCC; 
    } 

어떤 도움, 조언이나 여기

내보기 (오프 그리드 테두리) 지금 모습입니다 방향은 크게 감사드립니다!

Answer 1

이 가장 쉽게 마지막에서 제거 단지 모든 <TD> 요소에 국경 오른쪽을주는하여 수행됩니다.

.views-view-grid td { 
    border-right: 1px solid black; 
} 

일반적으로 드루팔은 목록의 첫 번째 요소와 마지막 요소에 자동으로 클래스를 배치합니다. 이러한 클래스를 사용하여 마지막 요소에서 테두리를 제거 할 수 있습니다. 그리드를 사용할 때 어떻게 동작하는지 모르지만 뷰를 사용하고 있으므로 HTML 목록 표시를 사용할 수도 있습니다. float : <li> 요소에 왼쪽을 사용하는 경우 스크린 샷처럼 동작합니다.

.views-view-grid td:last-child { 
    border-right: none; 
} 

: 현재 설정을 유지하려면

, 당신은 의사 선택기를 사용하여 시도 할 수 있습니다