将文字与图片右对齐

迈克尔·麦克古克

我想将所有3行文字对齐到图片的右侧。目前,它位于第二行。

我该怎么做呢?

http://jsfiddle.net/bhu4p04r/

CSS:

img {
    min-width:75px;
    height:90px;
    vertical-align:middle;
    margin-right:30px
}

HTML:

<div class="medium-12 columns"><img src="http://placekitten.com/g/75/90" />1<br />2<br />3</div>
希拉尔

将文本包裹在div中,然后制作图片float:left

<div class="medium-12 columns">
    <img src="http://placekitten.com/g/75/90" class="left" />
    <div class="right">1
        <br />2
        <br />3</div>
</div>

演示在这里。

垂直中间文字:

display:inline-block;图像和文本容器。

img, .text {
    display:inline-block;
    vertical-align:middle
}

在这里查看DEMO。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章