0

我有一个 div，其中包含 2 个图像。

第一个图像的高度与 div 高度一样，但第二个图像高度小于 div 高度。我想垂直居中对齐这个我没有做的图像。这是我的标记，请告诉我如何执行此操作，以便它适用于所有当前浏览器。

谢谢

 <div class="left">
        <img alt="" src="Images/Logo.png" style=" border:2px dashed red;" />
        <img class=TI alt="Tayyiba Institute" src="Images/TayyibaInstitute.png" style=" border:2px dashed orange;" />
    </div>

    div.Container div.Left
{
width:50%;
float:left ;
display:inline;
}

div.Container div.Left img.TI
{        
 width:92px;
 height:95px;
 float:left;
 line-height:200px;
 vertical-align:middle;
 margin:auto 0 auto 0;
 display:block ;
}
4

2 回答 2

1

好吧，这里有很多错误...让我一个接一个...

1）这里没有引号class=TI

2) 这里的容器 div 在哪里？div.Container div.Left img.TI

你需要将你的第一张图片向左浮动，然后position: relative;像这样给第二张图片：

我的小提琴

HTML

<div class="left">
    <img alt="" src="Images/Logo.png" style=" border:2px dashed red; float: left;" />
    <img class="TI" alt="Tayyiba Institute" src="http://www.cbfaizabad.org.in/images/bullet/0043_bullet2.png" style=" border:2px dashed orange;" />
</div>

CSS

.Left
{
float:left ;
}

.TI
{        
    position: relative;
    top: 5px;
}​

建议：清理 CSS 并了解更多信息

于 2012-10-13T11:40:36.820 回答
1

请保持简单。

标记：

<div class="left"> 
    <img alt="" src="Images/Logo.png" /> 
    <img alt="" src="Images/TayyibaInstitute.png" /> 
</div>

样式表：

.left img { 
    vertical-align: middle; 
}

有了这个结果。

于 2012-10-13T12:24:09.837 回答