[問題] 想用calc去運算單位為vw的數值

看板Web_Design作者 (red whale)時間7年前 (2017/11/11 10:05), 編輯推噓0(005)
留言5則, 2人參與, 7年前最新討論串1/1
我想用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://www.ptt.cc/bbs/Web_Design/M.1510365949.A.4C7.html

11/11 11:42, 7年前 , 1F
有程式碼嗎?不然不知道架構講了你可能也試出不一樣
11/11 11:42, 1F

11/11 11:42, 7年前 , 2F
的結果
11/11 11:42, 2F

11/11 11:58, 7年前 , 3F
用100vw配合margin或 transform: translateX 調整看看。
11/11 11:58, 3F

11/11 12:16, 7年前 , 4F
上面看錯你要的效果。如果可以變動htnl結構的話,外面可以
11/11 12:16, 4F

11/11 12:16, 7年前 , 5F
先包一層100vw配合padding 調整,內層用width: 100%就有了
11/11 12:16, 5F
文章代碼(AID): #1Q1bhzJ7 (Web_Design)
文章代碼(AID): #1Q1bhzJ7 (Web_Design)