如何在网页的两侧设置两个div而没有其他div在两者之间结束？

Question

我有一个标题和菜单，我想他们在我的网页的对角，有点像这样：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.Second方法是增加的高度<div id="wrapper">

3。第三种方法是将width:100%; overflow: hidden;加到<div id="wrapper">

你应该选择但是最好的方法是第一个使用clearfix的。