1

私は次のHTMLを持っています:

<div id="outer">
    <div class="content left"></div>
    <div class="content right">
       <div class="fill">
           <div class="blue">
             xxx <br> xxx
           </div> 
    </div>
</div>

CSS:

 body, html { height: 100%; }
#outer { position:absolute; margin:5%; bottom:0; top:0; left:0; right:0; overflow:hidden; }
.content { position:absolute; width:50%; height:100%; }
.content.left { background-color:yellow; }
.content.right { background-color:red; left:50%; }
.fill { padding: 2em; background-color: green; height: 100%;}
.blue { background-color: blue; }

フィドル

青いDIVの上と下のスペースが同じ高さになるようにするにはどうすればよいですか?

4

2 に答える 2

2

以下はあなたのために働くはずです：

.blue { 
  position:absolute;
  top:50%;
  background-color: blue;
}

コンテンツを縦方向に配置するための参考資料はこちらリンク

于 2013-01-08T14:33:30.747 に答える
0

期待していたものが表示されないため、またはプログラミング方法がわからないため、これを尋ねていますか? 「塗りつぶし」DIVを閉じるのを忘れたので、これを求めています。

これが問題でない場合は、位置を絶対に割り当ててみてください。

.blue{
    position: absolute;
    background-color: blue;
    padding: 10px;
}
于 2013-01-08T14:37:15.027 に答える