如何用CSS并排排列两个块

Question

我有一个徽标和一个二级菜单，我希望在同一行（最左侧的徽标和最右侧的菜单）出现。徽标宽度未定义，二级菜单宽度为200px。当我申请以下CSS，二级菜单推到下面的标志线（但仍然在页面的右侧）：

#logo { 
padding-bottom: 40px; 
} 

.secondaryMenu { 
width: 200px; 
float: right; 
margin-right: 0px; 
padding-right: 2px; 
color: black; 
font-size: 9px; 
letter-spacing: 1px; 
text-align: right; 
} 

下面是HTML的相关部分：

<div id="logo"> 
    <a href="index.html"> <img id="logoimg" border="0" alt="" src="images/logo.gif"/> </a>   
</div> 
<div class="secondaryMenu"> 
    <a href="about.html">About</a> | <a href="services.html">Services</a> | 
    <a href="contactus.html">Contact Us</a> 
</div> 

我将不胜感激任何想法我做错了。

Answer 1

#logo需要float: left

，那么你应该.secondardMenu后，用clearfix class'd容器可能添加clear: both风格的容器或包装材料他们两个