html - 如何对齐图片和文字

我有这样的样式定义表：

  <style>
table.box-left, table.box-left td, table.box-left th {
            border: 1px solid #005a8c;
            border-collapse: collapse;
            width: 320px;
            box-shadow: 1px 1px 1px #888888;
            margin-bottom: 5px;
        }
            table.box-left thead tr .lightgreen {
                height: 20px;
                background-color: #8DB135;
            }
 </style>

在表格单元格中，我有一个图像和一段文本，由于某种原因，文本没有环绕图像。有人可以帮忙吗?????

<table class="box-left">
                            <thead>
                                <tr>
                                    <th class="lightgreen">Test</th>
                                </tr>
                            </thead>
                            <tr>
                                <td>

                                     <img src="../images/54.jpg" width="80" height="140" />

                                   Hello, for some reason text doesn't display correctly as it supposed to. Can you help? Thanks so much in advance!!!
                                </td>
                            </tr>
                        </table>

最佳答案

只需添加img { float: left; }，它应该可以正常工作。

Check this fiddle.

关于html - 如何对齐图片和文字，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/25222354/