无法移动的元素更接近浮动元素

Question

为什么不能#navbar进一步上移？我试过margin-top，但没有奏效。只有一个非常大的值有一些效果，但是定位太偏斜。

#container包含所有3个元素。

#container { 
position:relative; 
margin: 0 auto; 
width:790px; 
} 

#chicklogo { 
float:left; 
border:1px solid black; 
} 

#rightext { 
float:left; 
border:1px solid black; 
} 

#navbar { 
clear:both; 
border:1px solid blue; 
} 

Answer 1

它不能因为#navbar有clear:both和将要归入最高的浮动元素。从你的图片中，你可以看到#rightext更高，#navbar坐在它下面。

如果您将徽标和正确的文本放在相同的高度，那么您的导航将位于两者之下。

Answer 2

我已经创建了一个JS Fiddle to demonstrate负margin-top这意味着即使它设置为clear: both，导航栏也会覆盖前一个元素。

理想情况下，您会降低#righttext元素的高度，因为它看起来像该元素中的空白区域会导致布局问题，但如果不可能，则负边界区域也可以工作。