如何使用CSS将两个块并排放置

3

我有一个标志和一个次要菜单,我希望它们出现在同一行上(标志在最左边,菜单在最右边)。标志的宽度未定义,次要菜单的宽度为200像素。当我应用以下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相关部分:

这是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>

我希望你能帮我看看我做错了什么。
1个回答

6

#logo 需要使用 float: left

然后您应该在 .secondardMenu 后面添加一个具有 clear: both 样式的容器,或者将它们两个包装在带有 clearfix 类的容器中


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接