0

私は青い div を設定しdisplay: inline-block;て、コンテンツにシュリンク ラップします。青い div を赤い div の中央に配置しようとしています。

<a href="www.google.com">hi</a>
<div class="dim">
    <div class="test">
        <div> test </div>
        <div> 2nd </div>        
    </div>
</div>​

.dim {
    height:100%;
    width:100%;
    position:fixed;
    left:0;
    top:0;
    z-index:1 !important;
    background-color:red;
    opacity: 0.5;
}

.test {
    border: solid;
    display: inline-block;
    background-color:blue;
}

コードへの Jsfiddle リンク

4

1 に答える 1

3

私はあなたのフィドルでこれを試しました。出来た。

.test {
    border: solid;
    display: inline-block;
    background-color:blue;
    position: fixed;
    margin-top: 50%;
    margin-left:50%
}

</p>

divのサイズを変更すると壊れます。div にサイズを設定しない場合、サイズを固定せずに中央に配置する唯一の方法は、JavaScript を使用することです。

しかし、より良い答えを見つけるために一生懸命探す必要はありません。

于 2012-11-06T00:49:21.427 に答える