Question

我有1个div包装h2和图像用div包装在div中。 h2是float：left和img float：right。

img div里面有图片。我想要的是

如果图片的高度和宽度是100px，而不是非vertical-align：middle 。请帮助。

使用vertical-align：middle

进行测试

CSS

.ver-mainbox{float:left; width:898px; border:1px solid #c3c3c3; padding:0px; height:122px; margin-bottom:15px; background-color:#ffffff;}
.ver-mainbox h2{font-size:18px;color:#000; padding-left:10px; margin:0px; vertical-align:middle; width:500px; float:left; padding-top:42px;}
.ver-mainbox .img{float:right; padding:0px; width:186px; height:122px;}

HTML

<div class="mainbox-area">
        <!-- Box start v1 -->
        <div class="ver-mainbox">                                                   
            <h2>Immunizations</h2>
            <div class="img"><img src="../../Content/images/v1.gif" alt="" title="" /></div>
        </div>                                                
        <!-- Box start v1 -->                                                               
</div>

Answer 1

vertical-align仅适用于表格单元格。您需要重新考虑如何处理此问题或使用display:table-*属性。

   <div style="display:table">                                               
        <h2 style="display:table-cell;vertical-align:middle">Immunizations</h2>
        <div style="display:table-cell;vertical-align:middle">
            <img src="../../Content/images/v1.gif" alt="" title="" />
        </div>
   </div>

图像不垂直对齐：中间

1 个答案: