javascript - CSS の列数と余白

Question

基本的に私がやろうとしているのは、そのように積み重ねられるWindows 8スタイルの「水平」メニューを再作成することです-

1 | 5

2 | 6

3 | 7

4 | 8

そして横方向に伸びます。CSS3 の列数を入力してください。ほとんどの場合、うまく機能します.2番目の最初のアイテム-> n番目の列は、最初の行よりわずかに高くなっています。私はCSSをいじっていますが、正しく理解できません..

ここにjsbinへのリンクがあります-

http://jsbin.com/urubub/36/edit

Answer 1

追加する

margin-top: 0

.itemこの矛盾を取り除くために。

Answer 2

css3 のルールについてはよくわかりませんが、このルールを追加することで問題が解決したようです。

ul > li:first-of-type{
    margin-top: 0;
}