css文本不對齊

Question

我有一個問題，集中我的div內的文本。有人可以幫我對齊這個文本框

這裏的中心就是我的CSS：

#btc-container { 
    height: 50px; 
    width: 150px; 
    background: orange; 
    border: 2px solid; 
    border-radius: 25px; 
    bottom: 50px; 
    left: 0px; 
    border-style: ridge; 
} 

#btc-price { 
    color: black; 
    font-family: digital-7; 
    font-size: 30px; 
    alignment-adjust:middle; 
} 

這裏是我的HTML：

<div id="btc-container"> 
    <div id="btc-price">930.1234</div> 
</div> 

Answer 1

只要改變你的css是這樣的：

#btc-price { 
color: black; 
font-family: digital-7; 
font-size: 30px; 
text-align: center; 
line-height: 50px; // or what ever is your button height 
} 

Answer 2

以居中對齊文字使用text-align: center。垂直對齊它會變得更加複雜（特別是如果你想跨瀏覽器和/或需要支持舊瀏覽器），但一個簡單的方法垂直居中文本內部文本，如果你知道它只有一條線正在使用line-height像line-height:50px情況

Answer 3

http://jsfiddle.net/isherwood/uN2Dt/

#btc-price { 
    text-align: center; 
    margin-top: 8px; 
} 

Answer 4

這裏是一個小提琴：http://jsfiddle.net/digitalextremist/QXT5B/

更改後的CSS：

#btc-container { 
height: 40px; 
width: 130px; 
background: orange; 
border: 2px solid; 
border-radius: 25px; 
bottom: 50px; 
left: 0px; 
border-style: ridge; 
padding: 5px 15px; 
text-align: center 
}