Css 我无法将div内容居中

这是我的小提琴：

我尝试了在互联网上找到的所有东西-设置：

margin:0px自动具有
宽度
，但不起作用

仅当我将添加一个属性时：
text align:center
到
标题
类它确实居中-但只有文本、图像仍在左侧位置

我的问题在哪里？

从图像中删除
浮动
在外部DIV上使用
text align:center
使用范围而不是内部DIV
将
垂直对齐：中间
应用于图像并跨距


HTML:

现场演示：
不错的技能伙伴！工作起来很有魅力。：）非常感谢。
<div class="head-title">
    <img class="list-icon" src="...">
    <span>Menu</span>
</div>

.head-title {
    width: 150px;
    height: 26px;
    padding: 5px;        
    text-align: center;
}

.head-title > * {
    vertical-align: middle;
}

.list-icon {
    width: 24px;
    height: 24px;
}