Document
body{
margin:0;
}
ul,li{
margin:0;
padding:0;
list-style:none;
}
.header-logo{
float: left;
margin-right: 30px;
}
.header-follow{
float: left;
margin-right:15px;
}
.header-nav li a{
float: left;
margin-left:56px;
font-size: 16px;
line-height: 22px;
}
.search{
float: right;
margin-right:15px;
}
.clearfix:before,
.clearfix:after{
content:'';
display:block;
}
.clearfix:after{
clear:both;
}
首先你代码中有浮动,但是没有清除浮动,导致父元素高度塌陷,其次文字的行高可以让文字垂直居中,button那里你可以试试vertical-align