텍스트로 CSS 클래스 이미지를 가운데에 배치하는 방법은 무엇입니까?

Question

내가 가진 무엇 : 나는 얻기 위해 노력하고있어
http://jsfiddle.net/nCs88/

: http://img545.imageshack.us/img545/888/42576e33afe343a0bab6a40.png

내가 절대 초보자 해요, 버튼 이미지가 텍스트 중심을 얻기 위해 노력하고있어. 어떤 도움을 주셔서 감사 드리며 몇 시간 동안 저를 실망 시켰습니다.

Answer 1

두 클래스 모두에 vertical-align:middle을 적용하십시오.

jsFiddle example

추가 :

.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>