You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
[css-shapes-1] Incorrect conversion from xywh() to the equivalent inset() function, for computed values #9053
Per the spec definition of the computed values in [css-shapes-1], we have to compute xywh() and rect() into the equivalent inset() function. There is a note in the spec:
Given rect(t r b l), the equivalent function is inset(t calc(100% - r) calc(100% - b) l). Given xywh(x y w h), the equivalent function is inset(y calc(x + w) calc(y + h) x).
It seems the equivalent inset() function for xywh() is not correct to me. Per definition of inset(), the four <length-percentage>s define the position of the top, right, bottom, and left edges of a rectangle, respectively, as insets from the corresponding edges of the reference box. Therefore, the right edge should be something like 100% - (x + w) because it is the offset from the right edge. Similar for the bottom edge. It should be 100% - (y + h).
There are two possible ways to fix this:
compute the equivalent rect() function, so we don't have to change the formula, and just change the function name.
still compute to equivalent inset() function, but update the note to something like: Given xywh(x y w h), the equivalent function is inset(y calc(100% - x - w) calc(100% - y - h) x).
I may use the 2nd way as the current proposal and add it to the wpt for now.
Activity
tabatkins commentedon Jul 10, 2023
Oh whoops, indeed, I got that conversion wrong.
inset(y calc(100% - x - w) calc(100% - y - h) x)is obviously the right answer.Compute <basic-shape-rect> to the equivalent inset() function.
Bug 1842277 - Compute <basic-shape-rect> to the equivalent inset() fu…
Compute <basic-shape-rect> to the equivalent inset() function.
Bug 1842277 - Compute <basic-shape-rect> to the equivalent inset() fu…
Bug 1842277 - Compute <basic-shape-rect> to the equivalent inset() fu…
Bug 1842277 - Compute <basic-shape-rect> to the equivalent inset() fu…
progers commentedon Sep 14, 2023
I just ran into this when working on these tests. We need to update the spec note (here) to mention the correct computed inset value for xywh.
@nt1m FYI, since you are also actively working in this area.
[css-shapes-1] Fix xywh() computed value. #9053
[css-shapes-1] Fix xywh() computed value. #9053
Bug 1842277 - Compute <basic-shape-rect> to the equivalent inset() fu…
Bug 1842277 - Compute <basic-shape-rect> to the equivalent inset() fu…