CSS佈局放置一個div屏幕

中心再次約CSS佈局：CSS佈局放置一個div屏幕

#container{ 
width:979px; 
height:590px; 
margin-left:auto; //works 
margin-right:auto; //works 
margin-top:auto; //doesn't work 
margin-bottom:auto; //doesn't work 
}

所以，我想的#container在屏幕中心放置。
我也試過了：margin：auto - 沒有resutl。

來源

2012-07-20 Alice

什麼是這樣的：

#container{ 
width:979px; 
height:590px; 
position:absolute; 
left:50%; 
top:50%; 
margin:-295px 0 0 -490px; 
}

來源

2012-07-20 15:29:51 gabrielhilal

作品，一切似乎有點骯髒。謝謝。 – Alice 2012-07-20 15:38:26

你有沒有試過margin-top:50%;你可能已經成功了。

來源

2012-07-20 15:24:02

最好的方法是使用display: table-cell和vertical-align: middle（它不適用於IE7-）。

因爲我們沒有你的HTML，所以我能做的最好的就是鏈接你this article，它爲你呈現了實現它的所有不同方法。

來源

2012-07-20 15:25:51 Calvein

如果你知道你的#container可以做以下的高度和寬度：

添加一個包裝的div圍繞容器，並將其設置的位置是：相對
設置#container的是位置：絕對，top：50％，left：50％，margin-left：-XXXpx，margin-top：-XXXpx其中XXX值是#container的寬度和高度的一半。

來源

2012-07-20 15:26:04

或者，也許你可以使用此解決方案：

<div class="container"> 
    <div class="block"> 
     <p>Hello world, i'm a vertical align div !</p> 
    </div>  
</div> 

div.bloc { 
    display:inline-block; 
    vertical-align:middle; 
}

來源

2012-07-20 15:27:19 Hakadel

Thamks，似乎解決了。 – Alice 2012-07-20 15:30:55

我認爲你正在尋找垂直居中，有blog如何做到這一點。希望有幫助。

來源

2012-07-20 15:27:47 xiaowl

謝謝，xiaowl，這將是有用的 – Alice 2012-07-20 15:39:50

如果你想用css做，你應該通過填充來手動設置它。否則，如果你希望它是動態的，你應該寫像下面的一個javascript： -

var a = window.outerHeight; 
var b = $('#id of div').height(); 
var c = (a-b)/2; 
$('#id of div').css("margin-top",c);

來源

2012-07-20 15:29:25

如果妳只想容器中的中心放置屏幕。試試這個

CSS：

html, body { margin:0; padding:0; } 

#container{ 
width:979px; 
height:590px; 
margin:0 auto; 
}

HTML

<div id="container"> 
Data goes here 
</div>

希望這有助於

來源

2012-07-20 17:12:21

CSS佈局放置一個div屏幕

回答

相關問題