1. 首頁
  2. 問答
  3. 絕對中心一個div？

絕對中心一個div？

2011-03-03 89 views
2

我有一個div內的另一個div有右側邊框和左居中：絕對中心一個div？

http://jsfiddle.net/Dhvfm/

我想改變內div到absolute，使得外div背後向上流動：

http://jsfiddle.net/Dhvfm/1/

現在它不居中。有什麼辦法解決這個問題嗎？

來源

2011-03-03 Rakka Rage

+1

您是指垂直，水平還是兩者？ – 2011-03-03 18:42:22

+0

爲什麼你爲'body'添加邊框而不是'margin：0 20px;'爲'＃outer'（沒有寬度）？另外，你是否想要'position：absolute'的第二個例子與第一個例子具有相同的外觀？ – Sotiris 2011-03-03 19:12:37

+0

是水平的，佈局是爲了使示例更簡單 – 2011-03-03 21:46:50

回答

4

您這裏有兩個問題：

  1. 你絕對定位的元素，但不提供top，bottom，left，或者right，所以它被留在原來的位置。這將是很好，除了...
  2. ...與百分比尺寸（width，height）abolutely定位的元素是其上下文父的外尺寸（在這種情況下，<body>元件）的百分比。

您可以將內部div重新對齊setting left: 0; on it，但它仍然會與身體的邊框重疊。要解決這個問題，最簡單的方法可能是放棄width財產，轉而使用​​。 （這對於絕對定位的元素來說是一種「智能拉伸」。）

來源

2011-03-03 19:57:46

+0

aha！我曾嘗試過（右側和左側），但忘記了當我做到100％時！非常感謝 – 2011-03-03 21:46:06

0

編輯：這是水平居中...

如果你知道你內心的div將是一套高度你在你的例子有，你可以計算利潤。對於你的例子：http://jsfiddle.net/Me7HK/2/

正如你所看到的保證金是(outer height - inner height)/2

來源

2011-03-03 18:43:43 KyleWpppd

相關問題

 相關問題