0

私はコンパスを研究してきましたが、遊んで使用するのは楽しいことですが、1つ気になることがあります(グリッドを破壊するためにパディングを追加できないこと以外に)、列をネストするにはどうすればよいですか?

ブループリントが行うことを実行できるようにしたいと思います。たとえば、24列のページが2つ(17列と7列)に分割されているようなネストコンテナーがあります。そのページの右側(7列のページ)で、いくつかの要素を2つ(2列と5列)に分割したいと思います。

私はこれを試しました:

#main
  +container

  #main-content
    +column(17)
    +box-padding(17, 10px)
    :margin
    :right 0

  #sidebar
    +column(7, true)
    +box-padding(7, 10px)

これがメインページのコードです。サイドバーには、いくつかのラベルと入力フィールドを含むリストが含まれています

li
  +container
  :margin
    :bottom 5px

label
  +column(2)
  :margin
    :right 0

input
  +column(5, true)

ちょっと動作しますが、firebugのliを調べると、7列しかないため、幅が270pxであるのに対し、実際には950pxであることがわかります。ネストされた列についてグーグルで調べてみましたが、コンパスに例が見つからないようです。私はまた、wikiとドキュメントを試しましたが無駄になりました。

4

1 に答える 1

1

問題の一部 (おそらく全体の問題?) は、containermixin を に適用したことだと思いますli。その mixin は幅を、!blueprint_container_sizeデフォルトで の値を持つ値として定義します950px(ただし、オーバーライドできます)。それを取り除けば大丈夫です。コンテナは、全体の中の部分ではなく、全体を描写することを意図しています。

于 2010-05-20T19:38:06.490 に答える