PTT數位生活區 / Web_Design

[問題] 有關 vertical-align

看板Web_Design作者 (4545454554)時間1年前 (2023/07/20 21:17), 1年前編輯推噓1(1推 0噓 4→)
留言5則, 2人參與, 1年前最新討論串1/1
各位好 https://jsfiddle.net/rmf4v2ps/ 如上連結 我對<img>和<span>都設定了 vertical-align: bottom 但只有<img>有對齊 line-height 的底部，<span>則沒有 想請問一下 是哪裡設定錯了嗎？ 謝謝 -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 220.142.220.117 (臺灣) ※ 文章網址: https://www.ptt.cc/bbs/Web_Design/M.1689859059.A.3A9.html
推
07/20 22:49, 1年前 , 1F
應該是因為span是行內元素，display:inline-block和
07/20 22:49, 1F
→
07/20 22:50, 1年前 , 2F
line-height:1em ，補上這兩段CSS就可以對齊底部了
07/20 22:50, 2F
→
07/20 23:00, 1年前 , 3F
因為span直接繼承了line-height，高度跟容器一樣，
07/20 23:00, 3F
→
07/20 23:00, 1年前 , 4F
所以沒有上下空間可移動，加line-height:initial
07/20 23:00, 4F
→
07/20 23:00, 1年前 , 5F
就可以回復預設值，inline-block則可有可無。
07/20 23:00, 5F
謝謝兩位　沒想到是span的line-height的關係 ※ 編輯: kisha024 (42.77.80.172 臺灣), 07/21/2023 10:27:08
‣ 更多 kisha024 的文章
文章代碼(AID): #1akJFpEf (Web_Design)
Web_Design 近期熱門文章
更多 近期熱門文章 >>
PTT數位生活區 即時熱門文章
更多 即時熱門文章 >>
‣ 更多 kisha024 的文章
文章代碼(AID): #1akJFpEf (Web_Design)