作者red0whale (red whale)
看板Web_Design
標題[問題] 想用calc去運算單位為vw的數值
時間Sat Nov 11 10:05:46 2017
我想用CSS的calc函數去運算單位為vw的數值
雖然現在的瀏覽器都支援這樣的算式
但是稍微舊一點點 (不算太舊)的Chrome有個Bug,就是不能用calc去運算單位vw或vh之類
viewport的單位
如果我今天有個屬性如下:
width: calc(100vw - 12px);
為了讓大部分用戶都能接受這樣的寫法
請問我可以用什麼替代方案?
註:父元件寬度並非100vw,所以用「width: calc(100% - 12px);」不是預期的結果。
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 114.44.0.41
※ 文章網址: https://webptt.com/m.aspx?n=bbs/Web_Design/M.1510365949.A.4C7.html
1F:→ miyabichiku: 有程式碼嗎?不然不知道架構講了你可能也試出不一樣 11/11 11:42
2F:→ miyabichiku: 的結果 11/11 11:42
3F:→ erozak: 用100vw配合margin或 transform: translateX 調整看看。 11/11 11:58
4F:→ erozak: 上面看錯你要的效果。如果可以變動htnl結構的話,外面可以 11/11 12:16
5F:→ erozak: 先包一層100vw配合padding 調整,內層用width: 100%就有了 11/11 12:16