在同一行中排列文本和图像

Question

这个问题已经回答了很多次，但是没有一个解决方案可以解决我的问题。 我有一些文本和图像线性对齐（在一行中）

我有http://grab.by/vLz2和http://grab.by/vLz8

有人可以帮忙吗？

Answer 1

您需要确保图像高度与字体大小相同。

.title{
   position:absolute;
   height: 15%;
   width:100%;
}

#wrapper{
    position:absolute;
    width:80%;
    height:50%;
    border: solid 1px black;
}

#title4{
    font-size:20px;
}

<!-- HTML part -->
<div class="title" id="title4">
    Title
    <img src="https://www.google.com/images/srpr/logo11w.png" 
         style="height:20px;vertical-align:top;"/> 
</div>

检查这个JSFiddle

Answer 2

您需要使用浮点数，因此在CSS中的某个位置会将该图像右移（float：right;）。