/*
 * 栅格布局，分24格，使用float实现
 * 使用：
 *  <div class="l-gd">
 *      <div class="u6"></div>
 *      <div class="u18"></div>
 *  </div>
 *  <div class="l-gd">
 *      <div class="u24"></div>
 *  </div>
 */

.l-gd {
    *zoom:1;

    &:before,
    &:after {
        content: ' ';
        display: table;
    }

    &:after {
        clear: both;
    }

    .ua,/* unit auto 宽度自适应 */
    .u1,/* unit 宽度1/24 */
    .u2,
    .u3,
    .u4,
    .u5,
    .u6,
    .u7,
    .u8,
    .u9,
    .u10,
    .u11,
    .u12,
    .u13,
    .u14,
    .u15,
    .u16,
    .u17,
    .u18,
    .u19,
    .u20,
    .u21,
    .u22,
    .u23,
    .u24 {
        float: left;
        min-height: 1px; /* 解决标签无内容时占位问题 */
    }

    .u1 { width: 4.1667%; }
    .u2 { width: 8.3333%; }
    .u3 { width: 12.5%; }
    .u4 { width: 16.6667%; }
    .u5 { width: 20.8333%; }
    .u6 { width: 25%; }
    .u7 { width: 29.1667%; }
    .u8 { width: 33.3333%; }
    .u9 { width: 37.5%; }
    .u10 { width: 41.6667%; }
    .u11 { width: 45.8333%; }
    .u12 { width: 50%;}
    .u13 { width: 54.1667%; }
    .u14 { width: 58.3333%; }
    .u15 { width: 62.5%; }
    .u16 { width: 66.6667%; }
    .u17 { width: 70.8333%; }
    .u18 { width: 75%; }
    .u19 { width: 79.1667%; }
    .u20 { width: 83.3333%; }
    .u21 { width: 87.5%; }
    .u22 { width: 91.6667%; }
    .u23 { width: 95.8333%; }
    .u24 { width: 100%; }
}