[問題] 請問這個CSS排版哪裡錯了??

作者: MAXQb   2020-03-08 01:19:36
想請問各位~
目前我的CSS排版預覽如下圖
https://i.imgur.com/jIGg5ws.png
其中A、B、C、D、F區塊皆沒問題
(有試過把E區塊的內容及CSS拿掉,A、B、C、D、F區塊皆沒變動位置)
但唯獨E區塊都沒辦法排在D和F區塊的中間
有試過調D、E、F間的大小、距離等等,但還是一樣
E區塊硬是跑到B區塊的上面,而E區塊的內容又在D區塊的下面
請問,這E區塊是少了什麼設定嗎? 該如何設定正確呢??
附上B~F的CSS碼
https://i.imgur.com/7jwWgHr.png
感謝。
作者: vavamos (vavamos)   2020-03-08 01:25:00
E區塊怎沒float
作者: itisjoe ( _(:3」∠)_)   2020-03-08 11:43:00
請善用線上工具 https://jsfiddle.net
作者: Rinorune (杜)   2020-03-09 00:06:00
大概是因為bc也是float吧 ... 實務上應該是不會這樣寫
作者: flowwinds (..)   2020-03-09 00:53:00
bcdf float移出了normal flow,故normal flow從E繼續?
作者: sonia1127 (△△△)   2020-03-09 01:47:00
clearfix
作者: sanyaoooo (山藥)   2020-03-09 10:51:00
用flex?
作者: Kenqr (function(){})()   2020-03-10 12:58:00
都2020了 建議用flex排版
作者: ai791016 (circle)   2020-03-11 00:01:00
全加 float 或 全不要
作者: Rinorune (杜)   2020-03-11 00:42:00
把同一row的元素包起來 裡面float inline-block flex隨便可以去觀察模仿市面上各大網站怎麼排的
作者: angty8520 (完全變態)   2020-04-03 02:41:00
下面兩個再包起來 就可以了啊

Links booklink

Contact Us: admin [ a t ] ucptt.com