Re: [問題] margin-top 以百分比設定的問題
※ 引述《franknine (f*******e)》之銘言：
: 各位板友大家好, 我最近遇到一個 CSS 的問題是我使用 margin-top 來排版圖像.
: 使用了 margin-top : 20% 像是這樣的 CSS 語法在圖片上.
: 結果排版在 Chrome 上炸掉了.
: 比較之後的原因我猜測是其他瀏覽器是以 parent 的 width 當作百分比乘上的數字,
: 但是 Chrome 是用 height .
: 我查過 W3C 的定義, 各方向的 margin 都以 parent 的 width 做參考.
: 想問說有辦法讓 Chrome 也照一樣的規則顯示嗎?
附一下網址:
http://www.upenntsa.org/
雖然求助於 conditional CSS , 但是 WebKit 系列的瀏覽器還是會用 parent 的
height 做為 margin-top 的百分比參考.
使用者垂直縮放的時候左右側的連結會位置跑掉.
其他使用 parent width 做為參考的瀏覽器, 連結就不會在縮放的時候位置跑掉.
W3C schools 對於 margin-top 的解釋如下:
The margin-top property sets the top margin of an element.
% Specifies a top margin in percent of the width of the
containing element
不過 Google 還是找不到對於這種 CSS 解釋不一致的討論.
使用 padding-top 的話 WebKit 就會改用 width 計算, 但是會有 layer 的問題,
讓使用者有的時候連結點不下去.
所以想問各位板友有沒有遇到這種問題的經驗.
或是說這種 layout 應該用完全不同的方式實做?
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 158.130.102.108
推
04/09 01:39, , 1F
04/09 01:39, 1F
→
04/10 15:41, , 2F
04/10 15:41, 2F
→
04/10 15:42, , 3F
04/10 15:42, 3F
→
04/10 15:42, , 4F
04/10 15:42, 4F
討論串 (同標題文章)
本文引述了以下文章的的內容：
完整討論串 (本文為第 2 之 2 篇)：