负面的上边距不会对儿童图像起作用

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？我假设每个盒子代表一个图标...我错了吗？