6

div親の中に子をdiv(header-image背景画像として) 垂直方向と水平方向の中央に配置したいと思います。

<div id="header-image">
    <div class="row">
        ... Content
    </div>
</div>

水平センタリングの解決策を見つけました:

<div style="position: absolute; left: 50%;">
    <div style="position: relative; left: -50%;">
        ... content
    </div>
</div>

しかし、コンテンツを一番下に移動する方法がわかりません(でのみ機能しposition:absoluteます)

http://webstopp.de/で理解を深めるために、header-imageとその中にいくつかのテキストが表示されますが、テキストは の下部にある必要がありますheader-image div

4

2 に答える 2

9
#header-image {
    background: url("http://placehold.it/200x200&text=[banner img]") no-repeat;
    height: 200px;
    width: 200px;
    position: relative;
    left: 0;
    bottom:0;
}
.row {
    position: absolute;
    left: 50%;
    bottom:0;
}
.inner {
    position: relative;
    left: -50%
}

フィドル

于 2013-06-07T08:57:11.343 に答える
-4

子divでこれを試してください:margin-top: 99%;

于 2013-06-06T16:58:06.630 に答える