Question

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 &amp; ADVICE EMAIL HERE</div>
</div>

Answer 1

如果您想将中间的文字与图片对齐，请将#header_Bi1 img { vertical-align:middle;}添加到您的css

插入图像后按下文本 - 需要垂直对齐文本

1 个答案: