私がやりたいことは、ここで行われていることと似ています http://www.starbucks.com/static/reference/styleguide/layout_promo_c.aspx
私はCSSとhtmlを調べて、リストを2x2の形式で表示する方法を理解しようとしています。
私が理解したのは、順序付きリストを使用してリストを整理し、各ブロックのコンテンツをdl要素を使用して構造化することです。なんとか4つの個別のブロックを作成できましたが、2x2の構造でそれらを取得することはできません。また、displayプロパティを設定しているのに、リストをインラインにできないようです。
編集：注がれたものを毛穴に変更
これが私のcssの関連部分です http://pastebin.com/zLSNu29b あなたはそれを無視したほうがいいでしょう：/
誰かが私を助けてくれますか？
難しいことではありません...div内の4つのブロックを幅で制限し、その4つのブロックのそれぞれにパーセント幅を指定し、すべてを左に浮かせます。
1つのブロックに幅の50％を割り当てる場合、その右側のブロックには幅の約48％が必要です。これは、マージンとパディングを含める必要があるためです。そのため、divが1000pxで、子供に500px、もう1人の子供に500pxを割り当てると、2番目のものは最初のものの下になります。
わかりますか？
リストアイテムは、コンテナの幅にまたがるまで並べて並べられるように左にフロートされ、次の2つは最初の2つの下にドロップダウンします。
box-sizing: border-box;幅の定義に境界線とパディングを含めるように幅の計算方法を変更するリストアイテムに適用することで、水平方向のパディングを指定しながら、50％の幅を使用できます。これはcss3プロパティであるため、古いブラウザでは機能しません。