If the user overwrites properties using an absolute shorthand, which the User Agent style sheet set using writing mode relative longhand properties, then they are not correctly shown as ~~crossed out~~ in the Styles pane of the Web Inspector developer tools. Currently, the only writing mode relative longhands used in the User Agent style sheet are `margin-*` and `padding-*` used on for example the `<p>` and the `<ul>` element. Absolute longhands are shown correctly as crossed out when using the absolute shorthand, for example the `padding-*` and `border-*` on a `<button>` element. --- User style sheet ```html <p>Hello World</p> ``` ```css p { display: flex; margin: 0; } ``` User agent style sheet ``` p { display: block; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; } ``` SHOULD result in ``` p { ~~display: block;~~ ~~margin-block-start: 1em;~~ ~~margin-block-end: 1em;~~ ~~margin-inline-start: 0px;~~ ~~margin-inline-end: 0px;~~ } ``` INSTEAD results in ``` p { ~~display: block;~~ margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; } ```
<rdar://problem/82287123>