使用相对于位置元素的边距或位置

我一直使用margin来将浮动div移动到父div中的正确位置（比如标头div内的logo div）。这一直有效，但这意味着你必须玩弄其他元素的高度，否则会影响到布局的其余部分。使用相对于位置元素的边距或位置

我今天发现了另一种方法，那就是让logo div位置：relative;然后使用示例top：20px;移动元素，这似乎不会影响布局。

我不想在不知道可能会有其他影响的情况下适应这一点，那么任何人都可以指出上述两种方法中的常见缺陷，或者可能提出更好的解决方案？

// Sample HTML 
    <div id='header'> 
     <div id='logo'> 
       LOGO GOES HERE 
     </div>  
    </div> 

    // Sample CSS 
    #header { 
     height: 100px; 
    } 

    // Version 1 
    #logo { 
     float: left; 
     margin-top: 20px; 
    } 

    // Version 2 
    #logo { 
     float: left; 
     position: relative; 
     top: 20px; 
    }

来源

2012-10-09 mauzilla

'位置：相对'不会移动任何其他元素，因为浏览器'假装'该元素仍然存在，不动，原来是在哪里。 –