html - 如何在网页的两侧设置两个 div，而其他 div 不在其间？

Question

我有一个标题和一个菜单，我希望它们位于我网页的对 Angular ，有点像这样:http://www.google.com/drive

我的网站是http://www.vincestechsupport.com/home.html

非常感谢您提供的任何建议。多谢你们。这是代码:

#Title {
  font-size: 35px;
  color: red;
  font-family: arial;
  float: left;
  display: inline;
  width: 100%;
  font-variant: small-caps;
}
#Title a {
  text-decoration: none;
  color: red;
}
#Menu a {
  text-decoration: none;
  color: red;
  width: 500px;
  padding-left: 20px;
  padding-right: 20px;
  font-family: arial;
  font-variant: small-caps;
}
#Menu {
  font-size: 30px;
  float: right;
  display: inline;
  font-family: arial;
  width: 100%
}
#Menu ul {
  list-style-type: none;
  padding-left: 5px;
  padding-right: 5px;
}
#Menu li {
  display: inline;
}

<div id="Menu">
  <center>
    <ul>
      <li><a href="home.html" title="Home"><b>Home</b></a>
      </li>
      <li><a href="services.html" title="Services">Services</a>
      </li>
      <li><a href="experience.html" title="Experience">Experience</a>
      </li>
      <li><a href="pricing.html" title="Pricing">Pricing</a>
      </li>
      <li><a href="contactme.html" title="Contact Me">Contact Me</a>
      </li>
    </ul>
  </center>
</div>

<div id="Title">
  <h1>
    <a href="http://www.vincestechsupport.com/home.html" title="Home">Vince&#8217;s Tech Support</a>
  </h1>
</div>

<div id="Home">
  <h1>Home</h1>
</div>

Answer 1

漂浮后你应该清除。

1.第一种方法是将“clearfix”类添加到<div id="wrapper"> - <div id="wrapper" class="clearfix">

并添加此样式:

.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }

2.第二种方法是给<div id="wrapper">增加高度

3.第三种方法是添加width:100%; overflow: hidden;至 <div id="wrapper">

你应该选择，但最好的方法是第一个带有 clearfix 的方法。