0

新しいプロジェクトを開始しましたが、レイアウト用に (のみ) レスポンシブ グリッドが必要です。http://www.responsivegridsystem.com/
このグリッド システム を試してみましたが、問題ありませんが、必要のない入力やその他の要素のクラスがいくつか追加され、一部のフォームが混乱します。 私はあらゆる解決策を探しています。 他の要素を台無しにしないレスポンシブ グリッドだけが必要です。 そのような枠組みはありますか？





4

2 に答える 2

1

おそらく、 display:flex を使用min-height min-widthして、コンテンツの少ない安全な最小サイズを維持するために childs を設定できます。

http://codepen.io/gc-nomade/pen/wFHfq

IE 10/11 が動作していることを確認するには、メイン コンテナーに幅または高さを追加する必要があります。ほとんどの場合width:100%、ここで私は設定height:100%しましたbody。

これは古いブラウザーでは機能しません。ベンダー プレフィックスと古い構文を使用して、互換性を高めることができます。ここに読むべきものがあります。 

body  div {
  display:flex;/* flex it */
  flex-wrap:wrap;
  min-width:320px;
  min-height:160px;
  box-shadow:inset 0 0 5px white, 2px 2px 3px;
flex:1;
}
html,body {
  height:100%;/*IE*/
  margin:0;
}
body>div {
  min-height:100%; 
}
div div {
background:pink;
}
div div:nth-child(even) {
  background:lightgray
}

基本的な HTML テスト:

<div>
  <div>
  </div>
  <div>
  </div>
  <div>
  </div>
  <!-- and so on -->
</div>
于 2014-04-13T14:21:31.070 に答える