CSS：使用浮动div垂直对齐图标旁边的文本

我正在尝试对齐图标/图像旁边的文本，我希望文本或图像垂直对齐，但未应用垂直对齐，这可能与浮动有关

下面是一张图片，解释了我想做什么：

以下是我目前掌握的情况：

----HTML---

---

我尝试过使用display:table/table cell，但它不起作用。

您可以使用CSS表格显示属性，这些属性是（除了IE 7或以下）

在此进行工作演示：

---

非常感谢你，杰西，这正是我想要的。我从没想过没有花车就可以做到这一点。

<ul class="toolboxItems">
    <li>
        <div class="image">
             <img src="someImage.png">
        </div>

        <div class="label">
           <label>Lorem ipsum dolor sit amet....</label>
        </div>
    <li>

    <li>
        /* more of the same .... */
    </li>
<ul>

ul.toolboxItems li {margin-bottom:10px;}
.image {float:left; width:30px;}
.label {float:left; width:150px; vertical-align:middle;}

.toolboxItems {
  display: table;
}

.toolboxItems li {
  display: table-row;
}

.toolboxItems .image,
.toolboxItems .label {
  display: table-cell;
  width: 30px;
  vertical-align: middle;
}

.toolboxItems .label {
  width: 150px;
}