html - 无法对齐图片和文字

标签 html css position

我一直在尝试完成一项荒谬的基本任务,但无法完成。

我想要一个简单的评论结构如下

*image*  *name*
         *comment*

我无法将文字放在图片的右侧。
这是我当前的 fiddle :http://jsfiddle.net/dvir0776/xaLosyjs/

<div class="comment"><img src="d.jpg" style="width:13%; margin-right: 12px;">
    <div style="text-align:left; font-size:8pt;">
        <h5 style="margin-bottom:0;">Chris Fanelli</h5>
        I would love to win the iphone 6 in black or gold or the mac or the cannon they all are great I love apple products!
    </div>
</div>

任何修复它的调整都会很棒。

最佳答案

只需将 float:left 添加到您的图像中即可。我猜这就是您要找的东西。

<div class="comment">
    <img src="d.jpg" style="float:left;width:13%; margin-right: 12px;">
             <div style="text-align:left; font-size:8pt;">
             <h5 style="margin-bottom:0;">Chris Fanelli</h5>
             comment comment comment comment comment comment comment comment comment comment!</div>
             </div>

关于html - 无法对齐图片和文字,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25956235/

相关文章:

javascript - 对象窗口 ['0' ] 和窗口 ['1' ] 在 javascript 中的含义是什么

jquery - 使用隐藏图像的基本图像 slider

jquery - 复选框列表,按字母顺序排列在自上而下的列中

css - 图像 Sprite 背后的想法是什么,如何处理它?

带有 2 个元素的 css 菜单栏(左端和右端)

需要 JavaScript 测验帮助

javascript - 谷歌地图获取可以通过拖动图钉更改的当前位置

html - Bootstrap 3.1.1 导航栏最大化输入在 3.2.0 中不再最大化

css 位置 jquery ui 组合框

xml - xpath - 获取所选集合的前 10 个项目