So schreiben Sie den Stil einer CSS3-Tianzi-Rasterliste

<Stil>
        ul li{ Listenstil: keine;}
        .mp-Liste{   
            Position: relativ;
            Überlauf: versteckt;
            Z-Index: 0;
            Hintergrundfarbe: #fff;
        }        
        .mp-list:vor {
            Inhalt: '';
            Position: absolut;
            Breite: 33,33 %;
            links: 33,33 %;
            Höhe: 100%;
            Rahmen links: .02rem durchgezogen #ddd;
            Rand rechts: .02rem durchgezogen #ddd;
        }
        .mp-Liste li {
            Breite: 33,33 %;
            Höhe: 2rem;
            Zeilenhöhe: 2rem;
            Schriftgröße: .28rem;
            Textausrichtung: zentriert;
            Rahmen unten: .02rem durchgezogen #ddd;
            Rand unten: -1px;
            schweben: links;
            Position: relativ;
            Z-Index: 10;
            Farbe: #212121;
        }
        .mp-Liste li a {
            Farbe: #212121;
            Anzeige: Block;
            Überlauf: versteckt;
            Textüberlauf: Auslassungspunkte;
            Leerzeichen: Nowrap;
            Schriftgröße: .28rem;
        }
    </Stil>

<ul Klasse="mp-Liste">
    <li><a hybrid-link="" href="" title="">Hongkong</a></li>
    <li><a hybrid-link="" href="" title="">Macau</a></li>
    <li><a hybrid-link="" href="" title="">Taiwan</a></li>
    <li><a hybrid-link="" href="" title="">Bangkok</a></li>
    <li><a hybrid-link="" href="" title="">Singapur</a></li>
    <li><a hybrid-link="" href="" title="">Seoul</a></li>
    <li><a hybrid-link="" href="" title="">Tokio</a></li>
    <li><a hybrid-link="" href="" title="">Insel Jeju</a></li>
    <li><a hybrid-link="" href="" title="">Pattaya</a></li>
</ul>

.mp-list:nach {
    Inhalt: '';
    Position: absolut;
    Breite: 10%;
    links: 75 %;
    Höhe: 100%;
    Rahmen links: .02rem durchgezogen #ddd;
    Rand rechts: 0;
}