Re: [csswg-drafts] [css-view-transitions-1] How do the writing-mode and direction properties affect the view-transition pseudo-elements? (#8230)

The position of the image elements (i.e. the -new and -old pseudo elements) are specified in terms of block and inline directions: https://drafts.csswg.org/css-view-transitions-1/#selectordef-view-transition-old-pt-name-selector

The css here is
```css
position: absolute;
inset-block-start: 0;
inline-size: 100%;
block-size: auto;
```

The block and inline directions map to vertical or horizontal physical directions based on the writing mode.

In layperson terms, in horizontal writing mode, the CSS above says "image is located at the top of its container; the image width fills the container and the image height is automatically determined based on aspect ratio and width"

However, in vertical left-to-right writing mode (as an example), this is "image is located at the left of its container; the image height fills the container and the image width is automatically determined based on the aspect ratio and height"

It's for this reason that we capture the writing mode and direction.

In practice, this would only be noticeable with CSS that changes the group pseudo element size, which would cause the inline size and the block size of the container to differ from the aspect ratio of the new or old images

Let me know if I can elaborate on anything better

-- 
GitHub Notification of comment by vmpstr
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/8230#issuecomment-1382128752 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Friday, 13 January 2023 16:51:16 UTC