CSS使用位置相對+絕對或負邊距

我想在另一個div（200x200）的中心放一個小格（50x50）。
CSS使用位置相對+絕對或負邊距

我有2種方法來做到這一點：

position:relative 
position:absolute 
top:75px; 
left:75px;

或

Using negaive margin

margin:-125px 0 0 75px;

我想知道哪種方式更好，爲什麼。 ..
我聽說有人說這個位置不被推薦..這是真的嗎？爲什麼？

編輯：
divs是exmaples。
實際上，我在另一張圖片（youtube預覽圖片，並在上面播放按鈕圖片）上方顯示圖片。
圖像是在手風琴內部，並在ie6關閉手風琴/打開它導致絕對容器浮在首位......

來源

2013-03-09 Ron

「位置」根本沒有問題。當然它有「副作用」，但如果你知道它們，你應該在適當的地方使用它們。投票結束該問題爲「不具建設性」。 – kapa 2013-03-09 09:30:20

[垂直和水平對齊（中間和中心）與CSS]（http://stackoverflow.com/questions/5421334/vertical-and-horizontal-align-middle-and-center-with-css）。 – Vucko 2013-03-09 10:08:54

@Vucko divs就是例子。在現實中，我得到了IMG上面的另一個IMG ..可以使用您的鏈接中的解決方案。 – Ron 2013-03-09 10:49:01

DIV沒有什麼錯誤使用absolute和relative定位，他們已經完全支持了很長的時間。在你的兩種方法中，我肯定會選擇絕對的和相對的位置，因爲邊距有點怪異。

我個人既不使用你的方法，而是把#small內#big，因爲它是一個小更語義正確的（因爲#small是內#big）。

See on jsFiddle

HTML

<div id="con"> 
    <div id="big"> 
     <div id="small"></div> 
    </div> 
</div>

CSS

#big { 
    width:200px; 
    height:200px; 
    background:red; 
    position:relative; 
} 
#small { 
    position:absolute; 
    width:50px; 
    height:50px; 
    margin-left:-25px; 
    margin-top:-25px; 
    left:50%; 
    top:50%; 
    background:blue; 
}

來源

2013-03-09 09:39:40

divs只是例子。在現實中，我得到了另一個img的img。無論如何不能使用你的建立.. – Ron 2013-03-09 10:47:01

絕對去絕對定位然後。 – 2013-03-09 11:03:09

使用margin更好！如果使用

position:relative 
position:absolute

您需要了解相關與外界

來源

2013-03-09 09:38:33

不建議的人誰不知道如何使用它的位置，對於我們其餘的人，它工作得很好。

我肯定不會使用負邊距..就像Tyriar said這很不好聽，也不容易閱讀。

至於ie6的錯誤，你會發現有很多錯誤，ie解決它們的方法是通過將你聲音不錯的html/css與失敗安全代碼相互比較，而不是爲了ie而將你的聲音html退化爲hacky html。

來源

2013-03-09 11:11:08 abbood

CSS使用位置相對+絕對或負邊距

回答

相關問題