今天遇到了一個CSS問題，就是我的程式碼裡面Input竟然與文字無法對齊

<input id="logobck" type="checkbox">
<span>自動登入</span>

就是這樣的一個寫法，要麼是IE7對不齊，要不就是高版本對不齊。後來我想用!important來解決，後來發現IE9貌似已經能夠辨析這個了。

在解決的問題過程中，我發現在IE7下面和更高版本佔用的寬高是不一致的，但是眼睛看過去，明明選擇框一樣的大小啊，我反覆確認並把input的margin、padding都設定為了0，可還是這樣。

經過仔細觀察，我驚訝的發現一個事實，就是IE7下面input checkbox佔用的寬高為20px，而其它版本只有13px

知道就好辦了，限定Input的寬和高就可以了。

然後用 (行高 - input高)/2-1 的公式寫了一個margin-top，解決了無法對齊的問題

2012-08-02備註：其實對input進行左浮動能更好的解決無法對齊的問題

2013-6-1補充：

實際上有更好的方式來解決這個問題，比如旁邊的字型為12px，那麼可以給input新增樣式

input{
    height: 13px;
    line-height: 13px;
    vertical-align:middle;
}