1

コンテンツの高さになりたい「メインコンテナー」という div があります。現時点では、div はブラウザ ウィンドウと同じ高さしかありません。私はこれを次のように修正しようとしました：

html, body{
  height: 100%;
  background-color: $main-background-color;
}

#main-container {
  width: 1024px;
  height: 100%;
  background-color: darken($main-background-color, 5%);
}

残念ながら、これは機能しません。私も試しました：

#main-container {
  width: 1024px;
  min-height: 100%;
  height:auto !important;
  background-color: darken($main-background-color, 5%);
}

これも効果なし。また、フロートを使用しないようにレイアウトを作り直しましたが、問題は解決しませんでした。ネットを精査した後、機能する他のソリューションは見つかりませんでした。他にアイデアはありますか？

また、これが影響するかどうかはわかりませんが、Rails 3 を使用しています。

4

3 に答える 3

2

divの下部に#main-container、次のコードを挿入します。

<div id="push"></div>

次に、CSSに次を追加します。

#push {
    clear:both;
}

これにより、フローティングdivに関係なく、コンテナ全体がコンテンツの高さまでプッシュされます。

于 2012-07-07T01:50:47.743 に答える
1

あなたが達成しようとしていることを誤解しているかもしれません。ただし、div をコンテンツの高さにすることだけが必要な場合は、単に高さを宣言しないでください...

html, body{
  background-color: $main-background-color;
}

#main-container {
  width: 1024px;
  background-color: darken($main-background-color, 5%);
}
于 2012-07-07T08:51:32.800 に答える
0

サイズをビューポートに制限するため、html/bodymin-height:100%の代わりに設定してみてください。ビューポートよりも高い場合は、ストレッチできるはずです。heightheight:100%main-container

html, body{
  min-height: 100%;
  background-color: $main-background-color;
}

#main-container {
  width: 1024px;
  background-color: darken($main-background-color, 5%);
}
于 2012-07-07T07:43:58.083 に答える