p > #foo + .bar { align-content: space-between; align-items: center; align-self: auto; all: inherit; animation: 3s ease-in 1s 2 reverse both paused slidein; animation-delay: 4ms; animation-direction: alternate-reverse; animation-duration: 5s; animation-iteration-count: 9; animation-name: my-animation; animation-play-state: paused; animation-timing-function: ease-in; backface-visibility: visible; background-attachment: local; background-blend-mode: darken; background-clip: content-box; background-color: rgba(12, 34, 56, 0.6); /* */ clear: left; color: aqua; display: block; float: right; justify-content: flex-end; position: relative; width: 1px; width: 2em; width: 3rem; width: 4%; width: auto; width: min-content; width: max-content; width: fit-content(5%); width: fit-content(var(--x)); width: var(--y); word-spacing: 1px; word-spacing: 2%; word-spacing: 3em; word-spacing: 4rem; word-spacing: normal; word-spacing: inherit; word-spacing: initial; word-spacing: unset; word-spacing: var(--z); z-index: -2; } p > #foo ~ .bar { align-content: var(--align-content); align-items: var(--align-items); align-self: var(--align-self); all: var(--all); animation: var(--animation); animation-delay: var(--animation-delay); animation-direction: var(--animation-direction); animation-duration: var(--animation-duration); animation-iteration-count: var(--animation-iteration-count); animation-name: var(--animation-name); animation-play-state: var(--animation-play-state); animation-timing-function: var(--animation-timing-function); backface-visibility: var(--backface-visibility); background-attachment: var(--background-attachment); background-blend-mode: var(--background-blend-mode); background-clip: var(--background-clip); background-color: var(--background-color); /* */ clear: var(--clear); color: var(--color); display: var(--display); float: var(--float); justify-content: var(--justify-content); position: var(--position); z-index: var(--z-index); } :host { --clear: clear; --from-var: var(--clear); }