負面的上邊距不會對兒童圖像起作用

Question

這就是我想要的chicklet框的樣子：！[] 1 由於某種原因，我無法使用負邊距讓twitter圖像到達中心框。我的親子關係有什麼問題嗎？

我的CSS是在外部表，但在這裏它是：

<style type="text/css"> 

#chicklet_container { 
    margin:20px auto 0px auto; 
    width:540px; 
    height:215px; 
} 

#chicklet_box { 
    margin:0px 0px 10px 0px; 
    width:190px; 
    height:160px; 
    border-style:solid; 
    border-width:33px 5px 5px 5px; 
    border-color:#45BA88; 
    position:relative; 
} 

#chicklet_box2 { 
    margin:-30px 0px 10px 0px; 
    width:190px; 
    height:160px; 
    border-style:solid; 
    border-width:0px 0px 30px 0px; 
    border-color:#3f4040; 
} 

#chicklet_text { 
    text-align:center; 
    margin:-196px 0px 0px 0px; 
    color:#FFF; 
    width:190px; 
    font-family:"Verdana, Geneva, sans-serif"; 
    font-size:27px; 
    line-height:20px; 
} 

#chicklet_text2 { 
    text-align:center; 
    margin:139px 0px 0px 0px; 
    color:#FFF; 
    width:190px; 
    font-family:"Proxima, Nova, Ultralight"; 
    font-size:26px; 
    line-height:20px; 
} 

#chicklet_box img { 
    margin:-250px 0px auto 5px; 
} 
</style> 

下面是HTML：

<div id="chicklet_container"> 
    <div id="chicklet_box"> 
     <div id="chicklet_box2"> 
     </div> 
      <div id="chicklet_text">Follow Me</div> 
      <div id="chicklet_text2">@soandsoandso</div> 
      <img src="images/twitter.jpg" alt=""> 
    </div> 
</div> 

Answer 1

你爲什麼要使用這麼多的保證金對準Twitter的鳥形象或文本。儘可能使用低邊距。相反，請嘗試使用該圖像position:absolute;和頂部左側屬性。它會更乾淨。但有一點要記住，如果你使用元素的絕對位置，檢查它的外部元素或父元素是否定位，如果不是，那麼事情可能會變得更糟，並且該子元素可能會去其他地方。

Answer 2

切緣陰性是不是黑客攻擊 - W3C甚至說：「保證金性質允許負值......」

閱讀更多：http://www.smashingmagazine.com/2009/07/27/the-definitive-guide-to-using-negative-margins/

我不同意在此情況下，雖然他們可能已經過去-強調。

爲什麼Chicklet Box 1裏面有Chicklet Box 2？我假設每個盒子代表一個圖標...我錯了嗎？