小弟自己在家看影片自學寫網頁,目前在切版1分2時碰到個問題。
先附上code:https://codepen.io/iampp0608/pen/Wjjoyv?editors=1100
看影片裡在最後補上box-sizing : border-box;
下方兩個div就會從上下兩層變成左右並排,不過我加進去之後倒是都沒改變,要把width改
成48%或49%才會有反應,只是就會變得很不工整,兩個div會有留白。
蠢問題還請麻煩各位指導,謝謝!

inline-block左右兩段div換行的話，有空白產生，註解掉

推樓上，或是用 float:left + clearfix 來解

用flex寫： .bottom { height: 400px; display: flex; }.right, .left { height: 100px; flex-grow: 1; }

你搜"inline-block space"翻成白話是..inline-block的元素跟元素間會有間隙他用了一些小技巧去處理,類似的技巧有好幾個,有些人直接用其他種排版方式去處理,因為inline-block其實跟一般人直覺反應預期的行為不一樣,多了間隙

那個間隙真的很討厭，如果你是排版魔人的話