3

よし、

私が行っていることを説明しようと思います。さらに情報が必要な場合はお知らせください。

基本的に、私は div コンテナを持っていて、height:100%;それを 100% でスタイルしましたが、現在のブラウザ/ウィンドウ サイズでは 100% しかありません。

例: ブラウザーを最大化すると、コンテナーは 100% になりますが、下にスクロールすると、そのコンテナーの高さはブラウザーの高さと同じだけになります。

別の例: ブラウザーを特定のサイズに最小化してページを更新すると、コンテナーは 100% 再びウィンドウ サイズのみになります。したがって、ブラウザを最大化しても、高さコンテナは、ブラウザが最小化された場合と同じ高さになります。

したがって、長いページがある場合、コンテナーはページまでずっと下に行くのではなく、ページが読み込まれるときにコンテナーはウィンドウの高さのサイズまでしか移動しません。

フッターまたはヘッダーがある場合でも、コンテナーをページの下部まで 100% 移動させようとしています。コンテナーは 2 つの間で 100% である必要があります。

したがって、最も関連性の高いコードを投稿してみます。

body,html
{
   display:block;
   position:relative;
}
#container_100percent
{
   overflow-x:hidden;
   position:relative;
   overflow-y:auto;
   width:20%;
   min-height:100%;
   height:100%;
   float:right;
}


<div>
  <div id="container_100percent">
     <!-- some stuff !-->
  </div>
</div>
4

2 に答える 2

1

100％の高さは彼の親の高さです。

つまり、親のdiv-containerに高さがない場合、高さも100％に設定され、bodyでも同じになります。これが、divがウィンドウの高さを持っている理由です。

したがって、divラッパーに高さを指定する必要があり、内側のdivがこの高さになります。

于 2012-04-19T07:13:52.620 に答える
0

コンテナをその内容と同じ高さにしたい場合は、heightプロパティを設定しないでください。それはそれと同じくらい簡単です。

ただし、最小の高さにしたい場合（つまり、ウィンドウよりも低くしたくない場合）は、min-heightプロパティを設定します。

于 2012-04-19T07:19:50.547 に答える