完全中心圖像和DIV

正如你可以在這裏看到http://dekkro.no-ip.org/完全中心圖像和DIV

我有兩個div，一個在另一個之上。我希望他們成爲100％死人中心。與頂部div，留在頁面調整大小的中心。他們以我爲中心，但對於很多人來說他們並不是。

我已經嘗試使用邊距和使用百分比，但仍然不完美。有沒有解決這個問題？

我目前使用

position:absolute; left:32%; top:24%;margin: auto;z-index:-1;

謝謝！

來源

2011-08-28 dekkytsh

你能告訴你正在談論哪些div嗎？ – sinelaw

早在一天，我也像在這裏描述：http://www.wpdfd.com/editorial/thebox/deadcentre4.html

也許現在有一個更好的更現代的方式，否則，你可以用它...

來源

2011-08-28 13:16:37 CodeReaper

如果寬度和高度的股利已修復，您可以使用負邊距將其居中。

例如，如果您有安全工程師一個div你可以居中這樣說：

div { 
    position: absolute; 
    width: 300px; 
    height: 200px; 
    left: 50%; 
    top: 50%; 
    margin-left: -150px; 
    margin-top: -100px; 
}

來源

2011-08-28 13:19:50 Ackar

我按照你的指示，現在圖像是這樣的 http://dekkro.no-ip.org/ 巔峯 – dekkytsh

Ì檢查了你的CSS，你在'margin-left'有正值， '保證金right'。他們需要消極。 –

嘗試更改：'margin-left：345px; margin-top：212.5px;'to-margin-left：-345px; margin-top：-212.5px;'並在image元素的style屬性中刪除'margin：auto'。 – Ackar

就瞎搞迅速對螢火蟲：

<div class="my_img" 
    style="position: absolute; top:50%; width: 100%;"> 
    <img width="690" 
     height="425" 
     style=" margin: auto;z-index:-1; margin-top: -212px;" 
     src="http://dekkro.no-ip.org/images/testimage.png"> 
</div> 
<div id="container" 
    style="position : absolute; 
       top : 0; 
       width : 100%; 
     margin-left : auto; 
     margin-right : auto; 
       height : 600px; 
      z-index : 5;">

如果你需要它保持居中時滾動，然後使第一行：

<div class="my_img" 
    style="position: fixed; top:50%; width: 100%;">

來源

2011-08-28 13:29:35 Stobor

我用這個，它的工作原理，但是當我用另一個水庫檢查我的另一臺計算機時，他們不再適用，例如... 請參閱圖像：http://dekkro.no-ip.org /problem.png 我該如何解決這個問題？ – dekkytsh

我猜我必須把它放在一個div裏面？ – dekkytsh

問題是第二個div的垂直對齊問題？我只顯示了第一個div的解決方案... – Stobor

完全中心圖像和DIV

回答

相關問題