0 
<div id="site_wrapper">
<div id="top"><?=$top?></div>
<div id="wrapper">
<div id="login_wrapper">
<?=$content?>
</div>
</div>
<div id="footer"><?=$footer?></div>
</div>

どこ

$top should be drawn on the very top of the page.  
$content should be centered both vertically and horizontally of the page.  
$footer should be drawn on the very bottom of the page.

どちらの div もビューに追従させたくありません。問題に対する 2 つの解決策を 1 つずつ見つけましたが、それらの両方が css に高さ要素を持っているため、それらを組み合わせることはできませんでした。それで、最初にそれが可能であるかどうかを推測します（私はそれが可能だと思います）2番目はもちろん、どのようにですか？

編集: こちら側とほぼ同じように、トップ バーは常に一番上にある必要があります。

次に、#login_wrapper は常に固定の高さでサイトの中央に配置する必要があります。

最後に、フッターは常に一番下にある必要があります (この場合、#login_wrapper はサイトを埋めないため)。

#top と #footer の高さも固定されています。

Edit2: 問題のいくつかの説明を修正しました。

このサイトから解決策を見つけました [リンク] http://stackoverflow.com/questions/7909587/horizo ​​ntal-and-vertical-centering-above-a-sticky-footer
-in-css とにかくありがとう!

4

1 に答える 1

0

あなたの質問を理解したら、このCSSを試してください

#site_wrapper
{
position: relative;
}

#top
{
position: relative;
top: 0px;
}

#footer
{
position: relative;
bottom: 0px;
}

#wrapper
{
position:relative;
vertical-align: middle;
height: 100%;
}

#login_wrapper
{
/* add some height */
}
于 2012-07-30T04:33:30.500 に答える