如何实现如图样子的CSS？

问题描述

实在是不懂CSS，求教。如何将几个元素水平布局在同一行上？且水平垂直居中基本html如下：<div id="dish"> <h3>Quantity</h3> <img id="minus" src="img/btn_minus.png" /> <input id="num" type="text" value="1" readonly> <img id="plus" src="img/btn_plus.png" /></div>

解决方案

http://runjs.cn/detail/v6ifpztf 看看行不行
解决方案二：
可以直接用表格的哇。。。。很多排版问题都是可以用表格解决的哦
解决方案三：
Dreamweaver 搞这些CSS 还是用这个 不然蛋疼菊紧天天有
解决方案四：
<div id="dish"> <table> <tr> <td> <h3>Quantity</h3></td> <td > <img id="minus" src="img/btn_minus.png" style=" vertical-align:middle"/></td> <td valign='middle'> <input id="num" type="text" value="1" readonly style="width:10px;"></td> <td> <img id="plus" src="img/btn_plus.png" style=" vertical-align:middle"/></td> </tr> </table></div>div里面加入table，并且给img设置style=‘vertical-align:middle’
解决方案五：
直接table表格不就行了。。
解决方案六：
可以用ul 里面放置li设置li里面的line-height: 25px;