Html Can'；t将图像与文本对齐

我无法将图像与文本对齐

#content img{
    border: 2px solid black;
    vertical-align: middle;
}

<div id="content">
    <h1><b>Company News 1</b></h1>
    <img src="http://www.placehold.it/120x120">
    <span style="">
        A lot of text...
    </span>
</div>

#内容img{
边框：2件纯黑；
垂直对齐：中间对齐；
}
公司新闻1
很多文字。。。

结果是：

---

我做错了什么？

我假设您希望文本包装图像？请尝试以下方法：

#content img{
  border: 2px solid black;
  float:left;
  margin-right:5px;
}

#content img {
border: 2px solid black;
float: left;
}

检查js小提琴

像这样

#content img {
    border: 2px solid black;
    vertical-align: middle;
    float: left;
    margin: 0 10px;
}

---

使用

float:left

属性

#content img{
    border: 2px solid black;
    vertical-align: middle;
    width:120px;
    height:120px;
    float:left;
}

小提琴：

#content img {
    border: 2px solid black;
    vertical-align: middle;
    float: left;
    margin: 0 10px;
}

简单易用。享受

#content img {
    border: 2px solid black;
    vertical-align: middle;
    float:left;
    margin:0 20px 10px 0;
}

---

你想要的布局是什么？看这个链接有人已经回答了这可能会帮助你看到这一点