如何使用CSS ....在頁面頂部中心位置放置一個div？

我無法在頁面頂部放置div，我正在使用css，但這裏沒有任何作用。如何使用CSS ....在頁面頂部中心位置放置一個div？

// little code snippet 
    <body> 
<div id="loader" style='display: none'><img src='img/basic/loader4.gif'/></div> 
    </body> 

    //CSS 
    <style="text/style"> 
     #loader{ 
      position:relative; 
      margin:0 auto; 
      text-align:left; 
      clear:left; 
      height:auto; 
      z-index: 0; 
     } 
    </style>

我已經給了2個小時，但仍然無法弄清楚。請幫我.... 謝謝

來源

2012-06-27 vips

首先從您的div中刪除display:none;，id = loader &添加text-align:center;它

#loader{ 
    position:relative; 
    margin:0 auto; 
    clear:left; 
    height:auto; 
    z-index: 0; 
    text-align:center;/* Add This*/ 
}

工作演示：http://jsfiddle.net/surendraVsingh/FCEhD/

來源

2012-06-27 10:32:07 SVS

您需要一個特定寬度的div，否則它將使用所有可用，並且邊距無效。例如：

#loader{ 
    margin: 0 auto; 
    width: 200px; 
}

來源

2012-06-27 10:25:51 Guffa

#loader{ 
    margin: 0px auto; 
    width: 100px; 
}

來源

2012-06-27 10:25:58 slash197

您必須指定width財產，如果你想使用margin: 0 auto;。

如果你不知道寬度只需添加display: table屬性，它會起作用。

#out { 
    display: table; 
    margin: 0 auto; 
}

來源

2012-06-27 10:26:36 Sajmon

非常感謝其工作現在..... – vips

<div id="loader" style='display: none' align="center">

按ctrl +空格我不知道有關語法和CSS margin和padding必須設置0

來源

2012-06-27 10:27:10 Amith

#loader 
{ 
    position: absolute; 
    width: xxpx; 
    height: xxpx; 
    margin:0px auto ; 

}

或U可以使用

margin-left:xx; and `margin-top:0px;`

來源

2012-06-27 10:31:33 Prashobh

#loader{display:none;clear:both;margin:0px auto;width:[a number]px;}

當然你也應該注意瀏覽器緩存。清除瀏覽器緩存並再次測試

來源

2012-07-29 10:14:58

在上面的例子中，每個人都假設他想要'全角'。

這絕對全寬/高父容器，但限制寬度範圍內自動工作只在內容寬度

父容器

display: block; 
position: absolute; 
clear: both; 
width: 100%; 
height: 100%; 
border: solid thin red;

子容器

display: block; 
position: absolute; 
top:0; 
transform: translateX(50%); 
padding-left:.5em; 
padding-right:.5em; 
margin-left:auto; 
margin-right:auto; 
right:50%;

來源

2018-01-29 08:43:37

如何使用CSS ....在頁面頂部中心位置放置一個div？

回答

相關問題