[CSS 코드 조각] 깔끔하게 그리드를 짜는 코드

.l-grid {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.l-grid > li {
    display: inline-block;
    margin: 0 0 10px 10px;
    /* IE7 hack to mimic inline-block on block elements */
    *display: inline;
    *zoom: 1; 
}

이 코드는 SMACSS에 나오는 코드다. inline-block으로 썸네일 그리드 같은 것을 깔끔하게 처리한다. ul에 l-grid라는 클래스를 주면 된다. IE7 이상에서 작동한다. (.l-grid > li 를 .l-grid li로 변경하면 IE6에서도 작동한다. 하지만 li 안에 li를 쓸 때 골치아파질 거라는 점을 알고 그렇게 해야 한다.)