css实例之clearfix清除浮动

编辑代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>clearfix实例：</title>
<style>
#container {
	  background-color: #AAA;
  	width: 80%;
}

#logo {
	float: left;
  background-color: green;
}


#login {
  float: right;
}

#search {
	float: right;  
}

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

.clearfix {display: inline-block;}  /* for IE/Mac */
</style>
  </head>
<body>
<div id="container" class="clearfix">
  <div id="logo">
    <h1>Title</h1>
  </div>
  
	  <div id="search">
      <input type="text"/>
      <button>Search</button>
    </div>

    <div id="login">
      <button>Register</button>
      <button>Sign In</button>
    </div>
</div>

</body>
</html>