html - 如何将 css 类图像与文本居中？

Question

我得到了什么：http:
//jsfiddle.net/nCs88/

我想要得到什么：http:
//img545.imageshack.us/img545/888/42576e33afe343a0bab6a40.png

我是一个绝对的初学者，我试图让按钮图像以文本为中心。永远感谢任何让我沮丧几个小时的帮助。

Answer 1

只需申请vertical-align:middle这两个课程。

jsFiddle 示例

添加：

.dbutton, .ctrlbutton {
    vertical-align:middle;
}​

Answer 2

尝试这样的事情

<style type="text/css">
 .itButton{
    border:1px solid #abc; 
    display:table-cell; 
    text-align:center;        
    /* width:200px */  
  }    
 .itBtn{
    display:inline-block; 
    vertical-align:middle; 
    margin:5px 5px 5px 5px;
  }
</style>

和

<div class="itButton">
   <div class="itBtn"><img src="user.png" alt="" /></div>
   <div class="itBtn">My Button</div>
</div>