JS FIDDLE: http://jsfiddle.net/nick55555/7tfca64y/
我可能有一个很容易解决的情况,但无法弄清楚如何做到这一点。我有一个简单的div
里面有一些文本,它垂直在中心,但是当我将图像插入同一个div
时,文本现在比原来低。如何使文本与插入图像之前相同的垂直高度?图像垂直对齐完美,但文本不是......
#header_Bi {
height: 39px;
width: 748px;
margin: 0;
float: left;
border-left: 1px solid #191919;
border-right: 1px solid #191919;
border-bottom: 1px solid #191919;
font-family: arial, verdana, helvetica, sans-serif;
font-size: 15px;
color: #fff;
font-weight: 100;
text-transform: uppercase;
background: #2c2c2c;
text-align: center;
}
#header_Bi1 {
height: auto;
width: auto;
margin-top: 10px;
}
<div id="header_Bi">
<div id="header_Bi1">
<img src="../images/youtube_tiny.jpg" width="20" height="20" alt="youtube_tiny">
<img src="../images/twitter_tiny.jpg" width="20" height="20" alt="twitter_tiny">
<img src="../images/facebook_tiny.jpg" width="20" height="20" alt="facebook_tiny">
<img src="../images/google_plus_tiny.jpg" width="20" height="20" alt="google_plus_tiny">SALES & ADVICE EMAIL HERE</div>
</div>
如果要
将中间的文本与图像对齐,请将#header_Bi1 img { vertical-align:middle;}
添加到css中