警示：inline-block的基線是最后一行文字的底部，flex里面的基線是第一行文字的底部（請看下文阮老師的文章）
滿滿的都是淚啊。。。既然都叫baseline，何必呢？
使用inline-block進行圣杯布局：
這里也沒什么好說的，用到的也是width：auto和width：100%這兩點，簡單知識點的簡單用法。
雙飛的話，代碼跟圣杯的基本相同，注意在html的順序變?yōu)閏enter>right>left，只改左欄移動的margin-left: calc(-100% – 100px)到預(yù)定位置即可。不能用calc的話可以在center里面再加一層，跟浮動一樣的處理方式。更簡單的方法是使用CSS3帶給我們的box-sizing屬性。請看代碼：
總結(jié)：相比浮動inline-block更加容易理解，也更符合我們的認(rèn)知，結(jié)合盒子模型的幾個控制屬性就可以進行布局了。對于元素高度不同的情況，目前浮動布局的做法都是將元素做成等高元素進行展現(xiàn)，這從美學(xué)上看也符合整齊的要求，不過犧牲了一部分內(nèi)容。但inline-block有vertical-align屬性，可以很好地解決元素高度不同而帶來的布局問題。用過之后，你也會喜歡上inline-block的。。。至少我會！
絕對定位
前面的浮動和普通流中其實定位都是靠盒子模型控制的，與我們常說的定位還是有差別的。而絕對定位就是我們平常所說的定位，給定參考坐標(biāo)系+坐標(biāo)確定位置。關(guān)于絕對定位的資料太多，我就不說了。提一點就是absolute定位的基準(zhǔn)是最近的非static定位父對象，而fixed是相對html根節(jié)點的定位。兩種定位都會脫離普通流，跟之前說的浮動一樣，上天了。