2017-01-09 2 views
-2

Unfortunaellyの質問が長すぎてGoogleやここで適切な結果を得られない場合は、svg要素のスケーリングがあります。html/css/bootstrapの子の数に基づいて親divのスケールを作るにはどうしたらいいですか?

私がやりたかったのは、オンラインショップを作ることでした。そこには、親にdivボックスの結果が含まれていて、親のサイズは子供の数に比例している必要があります。

これは、最小高さの始点:768ピクセルを使用するよりも、行ごとに4つの子divが14個あるとしますが、200個の子供がいる場合は、コンテナとコンテナの親の高さを(200/4-4)* 128px、4行は基本画面で、他は46通りに収まらないので、どのようにダイナミクスを行い、画面解像度に基づいていますか?

編集:私はいくつかの詳細を追加しようとしました:あまりにも多くがある場合、私は気圧をやりたい IMG of my current statusは増加のライトグレーボックスのサイズ、その親(ホワイトボックス)とその親(ほぼ透明ボックス)であります最初のコンテナ(明るい灰色のボックス)の境界を残す赤いボックス

+1

通常のブロック要素では、デフォルトあたりの高さが増加します。あなたはこれに対する答えを得るために、より多くの情報を提供する必要があります。 –

+0

私はその親にブロックを追加しましたが、その親の親はサイズが増えていません、どうすればいいですか? –

+0

したがって、最も高い列の子の数に基づいて親のサイズを拡大するには?子供のサイズはデフォルトであり、一般的にはよりフィットしていると考えられます。あなたが何をしようとしているのかは分かりません。 – abluejelly

答えて

0

ノードの親の親にstatic heightプロパティを設定しないでください。

overflow: scroll; 

は、私が知る限りでは動作します。

+0

こんにちは、ありがとう、私は本当にこの1つを忘れて愚かな感じ、それは本当にPC上で素晴らしい仕事をします。私の主な不満は、それがモバイルでうんざりしているということです。また、この質問とは無関係に、私がスクロールを追加したときには、それだけではスクロールの矢印が追加され、スクロールの左/右は必要ありません。 。 –

+0

パディングとボックスサイズが、使用中のデバイスのview-port-max幅より広くならないようにします。それは働くことになるあなたの価値を試すようなものでしょう。この問題のためにブートストラップを使用する方が簡単です。 必要以上に幅広くなる要素のデフォルトのブラウザ動作をクリアするためにすべてをリセットする必要があるかもしれません –

0

たぶん、あなたは時々、この私は誰もがオブジェクトの内側と問題の配置が設定されていると、おそらくあなたをそれらをすべてスケーリングよりも、いくつかの複雑なオブジェクトを作成しようとしている私のような場合に

+0

私はそれが覚えている時間があると思っています。 。 –

0

は、それを解決使用http://masonry.desandro.com/

jsのソリューションが必要です私のように何かしました。

私はすべてのオブジェクトを中央に配置しています。 位置:絶対;トランスフォーム:translateX(-50%);そして私は10個のオブジェクトのようにこれを好きでした。絶対的な位置は、サイズを増やす代わりに子供のdivを変えずに済ませました。すべての子供が90%の幅を持つため、コンテナ5%のパディングを追加するだけです。包含物の子供の位置を設定しないでください。ちょうどパディングとマージンでそれらを操作してください。

関連する問題