[問題] 請問codepen範例中RWD的元素上下排列

看板Web_Design作者 (...)時間6年前 (2017/08/30 18:03), 編輯推噓1(103)
留言4則, 3人參與, 最新討論串1/2 (看更多)
大家好 就是我在RWD的 max-width: 768px 中 要怎麼樣讓 left-col和 right-col 不是像桌面版本一樣並排(兩者排成一列) 而是希望讓兩者上下排列( left-col 在上,right-col在下 請參考 https://codepen.io/anon/pen/NvEEwM 我是在後面的原始碼中加了 @media only screen and (max-width: 768px){ .left-col{ width:100%; } .right-col{ width:100%; position: relative; left:0%; top:100%; } } 可是沒有運作成我想要的樣子,反而是right-col 蓋在 left-col之上 不知大家有沒有什麼建議呢? 謝謝大家~ -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 106.105.120.70 ※ 文章網址: https://www.ptt.cc/bbs/Web_Design/M.1504087394.A.B60.html

08/30 18:37, , 1F
.left-col 是絕對位置喔
08/30 18:37, 1F

08/30 18:56, , 2F
樓上正解,把css第11行的position: absolute; 刪掉就好
08/30 18:56, 2F

08/31 18:54, , 3F
嗯嗯~謝謝各位開示 在codepen是可以的,只是在我寫
08/31 18:54, 3F

08/31 18:55, , 4F
的網頁上好像還是不行,我會再研究的 謝謝各位~
08/31 18:55, 4F
文章代碼(AID): #1PferYjW (Web_Design)
文章代碼(AID): #1PferYjW (Web_Design)