我有一个
HTML页面,其中包含具有可变高度的内联块div(标有.banner类):
<html> <head> <body> <div id="container"> <div id="header" style="margin: 0; width: 100%"> <div> <div class='banner'> ... </div> <div class='banner'> ... </div> <div class='banner'> ... </div> </div> .banner { display: inline-block; }
它们具有不同的宽度,并在运行时添加.网站布局看起来很丑,横幅没有垂直对齐.
由于未知原因,div不是从左上角开始,而是在顶部有一些空白区域.如何垂直对齐它和下一个横幅(例如使它们的底线对齐)?
我正在使用jQuery,jQueryUI和ASP.NET MVC2.
解决方法
.banner { display: inline-block; vertical-align:middle; }