股利中心問題

-4

用的寬度250像素每

與主容器我想這些框爲中心對準主容器內的div 2。然而問題是第二個div動態添加。所以如果第二個div不在那裏，第一個div應該居中。當第二個div被添加時，兩者都應該按照940 px主div進行聆聽。

我嘗試了很多，但無法找到解決方案。請幫忙！

下面是簡化的代碼

CSS

div.box { 
    background: #EEE; 
    height: 400px; 
    width: 940px; 
} 
div.left { 
    background: #999; 
    float: left; 
    height: 390px; 
    width: 250px; 
} 
div.right { 
    background: #666; 
    height: 390px; 
    width: 250px; 
    float: left; 
} 
div.clear { 
    clear: both; 
}

HTML

<div class="box"> 

     <div class="left">Tree</div> 
     <div class="right">View</div> (this div will dynamically add) 
     <div class="clear" /> 

    </div>

感謝

來源

2013-08-07 sukhpreet singh

你的源代碼在哪裏？ here image not display – falguni

我無法發佈圖片，所以我編輯了我的評論。添加了參考代碼。 –

使這個removeclear:both;類

http://jsfiddle.net/jWVxd/4/

CSS

div.box { 
    width: 940px; 
    background: #EEE; 
    height: 400px; 
    display: table; 
    padding:10px; 
} 
div.left { 
    background: #999; 
    display: table-cell; 
    width: 250px; 
} 
div.right { 
    background: #666; 
    display: table-cell; 
    width: 250px; 
}

來源

2013-08-07 12:04:44 falguni

OP要div在中心，檢查了你的jsfiddle它沒解決 –

非常感謝。但是有沒有一種解決方案可以在IE7中運行此代碼。 –

試試這個在您的div.box CSS

margin:0px auto;

對於演示CHK這一點JSFIDDLE DEMO

來源

2013-08-07 12:07:49

只需添加margin:auto;您div.box，它會在中心

JS FIDDLE DEMO

編輯： 這裏有隱藏的第二個DIV（「.right」）和它的做工精細

2nd Demo現在按Ctrl與-（減號）查看其中心

來源

2013-08-07 12:21:55

感謝您的回覆。但是當你嘗試刪除第二個盒子時。第一個盒子不在你的例子中。 –

股利中心問題

回答

相關問題