为什么这两个东西不能垂直居中?http://www.imooc.com/video/2513
<div class="note"> <div class="note_left"> <div class="news"> <span>新闻中心</span> <a href="">More>></a> </div> <div class="center"> <div class="main"> <img src="images/news.jpg" /> <div class="center_news"> <h5>520 慕女神喊你来表白!</h5> <p>活动时间:5月20日—5月25日<br/>获奖公布时间:5月26日</p> <a href="">More >></a> </div> </div> </div> <div class="note_bottom"></div> </div> <div class="note_middle"> <div class="news"><span>课程中心</span><a href="">More >></a></div> <div class="center"></div> <div class="note_bottom"></div> </div> <div class="note_right"> <div class="news"><span>媒体聚焦</span><a href="">More >></a></div> <div class="center"></div> <div class="note_bottom"></div> </div> </div>
.note{height: 250px;background-color: white;} .note_left,.note_middle,.note_right{height:250px;border: 1px solid #e8e8e8;float: left;} .note_left{width: 340px;} .note_middle{width: 410px;margin-left: 7px;} .note_right{width: 230px;margin-left: 7px;} .news{height: 35px;border-bottom: 1px solid #e8e8e8;} .news span{display: inline-block;float: left;margin-left: 20px;color: gray;line-height:35px;font-weight: bolder;} .news a{display:inline-block;float: right;margin-right: 20px;color: gray;line-height: 35px;} .news a:hover{color: #990000;} .center{height: 110px;border-bottom: 1px solid #E8E8E8;} .main{height:110px;line-height:110px;} .center img{float: left;margin-left: 10px;vertical-align: middle;} .center_news{line-height: 22px;float: right;margin-right: 50px;} .center_news h5{color: #990000;} .center_news a{color: #990000;}
如图,感谢回答!