Html href中有3个跨距，与img垂直对齐

我确实有这样一个部门：

<div class="frontend-shop-cart-left">
   <a href="#">
      <img src="#" style=" display:inline; vertical-align: middle;height:60px; width:60px; " />
   </a>
   <a href="#">
      <span style="margin-left: 15px; font-size: 14px;" >1</span>
   </a>
</div>

|-------|
| image | 1
|       |
|-------| 
 2 3

但是我想要这个

|-------|
| image | 1
|       | 2 3
|-------| 

我的html代码如下所示：

<div class="frontend-shop-cart-left">
   <a href="#">
      <img src="#" style=" display:inline; vertical-align: middle;height:60px; width:60px; " />
   </a>
   <a href="#">
      <span style="margin-left: 15px; font-size: 14px;" >1</span> <br/>
      <span style="margin-left: 15px; font-size: 14px;" >2</span>
      <span style="font-size: 14px;" >3</span>
   </a>
</div>

---

我的CSS有什么问题？

让

img

元素使用

float:left

<img src="#" style="float: left; ....

让
img
元素使用
float:left

<img src="#" style="float: left; ....


将锚点显示为内联块元素，并通过
垂直对齐：中间如下所示：


a{
显示：内联块；
垂直对齐：中间对齐；
}

同时为图像指定
vertical align
将删除（属于位于基线中的内联元素），因此您可以继续使用它

img{
垂直对齐：中间对齐；
}
将锚点显示为内联块元素，并通过
垂直对齐：中间如下所示：


a{
显示：内联块；
垂直对齐：中间对齐；
}

同时为图像指定
vertical align
将删除（属于位于基线中的内联元素），因此您可以继续使用它

img{
垂直对齐：中间对齐；
}
这是因为锚定标记不是块元素。您可以将
display:inline block
添加到锚定标记，或者将第一个或两个锚定标记浮动到左侧

这里拉小提琴：
这是因为锚标记不是块元素。您可以将
display:inline block
添加到锚定标记，或者将第一个或两个锚定标记浮动到左侧

在这里摆弄：
简单地放两个
简单地放两个
你不应该真正地浮动内联元素；您不应该真正浮动内联元素；