**
誤區一：
以為對齊了，其實沒有，只不過aaaa和sdfbb的高度太小，所以貌似對齊了，把他的高度調到和input的高度一樣就知道了，input是往下偏的。
答案：最好的辦法是加上浮動，別忘了給父元素去除浮動
答案二：給被對齊的元素加上vertical-align：middle（居中）
vertical-align：bottom（底部）
每次用到了 元素 和inline-block的（不一定是span，其他一些inline的元素也是一樣）元素，他們總是會不在乙個水平線上，這個時候就很蛋疼了，畢竟不在水平線上，很不美觀。
有以下解決辦法：
對於input和span都用浮動，這樣就是平齊的，但是記得在外面清除浮動，避免對其他元素造成影響
不加浮動時，可以通過截圖發現，它是不再一條水平線上的，有錯位的情況。在加了浮動後，情況如下圖：
**如下：
2. 有的時候並不想用浮動解決，這時候可以用vertical-aline來實現。
在w3school中，對於 vertical-aline 的介紹是：該屬性定義行內元素的基線相對於該元素所在行的基線的垂直對齊。
給input加margin後，2個輸入框的距離就可以拉開了，按照我們想要的進行設定。還有這個vertical-align必須加在span標籤上。
如果說，你想將vertical-align加在input上，那麼，你就必須進行如下的設定，才能達到你想要的效果：
布局還是沒變，就是上面的圖，只是css變一下
input框中間也有了距離，而且input和span也在同一水平線上
其實也就是讓行內元素變成行內塊元素，並且加入了垂直對齊vertical-align:bottom，而且這裡只能是bottom,其他的值，我一一嘗試過了，效果都達不到我們想要的。
input 與其他元素對齊
相信大家一定遇到過input與其他元素無法對齊的情況，不論type是text radio checkbox，由於input有其獨特的預設樣式，padding和border 行高 字型樣式等。1.radio checkbox型別 2.text型別，移動端對齊問題居多，pc端沒對齊一般是由於input的...
CSS例項 二 靈活使用Input元素
在web開發過程中，資訊錄入介面中，經常會有乙個特殊的輸入元素，如 必填字段 日期選擇字段 在彈出視窗中選值的字段，使用css來設定這些元素的外觀，可以省去一些不必要的按鈕 提示，使頁面更加簡潔。效果如下 實現這樣的效果，只須一張 css 很簡單 html html xmlns xml lang z...
css行內元素和塊元素
塊元素 總是在新行上開始 高度，行高以及外邊距和內邊距都可控制 寬度預設是它的容器的100 除非設定乙個寬度。它可以容納內聯元素和其他塊元素 行內元素 和其他元素都在一行上 高，行高及外邊距和內邊距不可改變 寬度就是它的文字或的寬度，不可改變 內聯元素只能容納文字或者其他內聯元素 塊級元素 div ...