Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- This WPT test may be referenced by the following Test IDs:
- /css/css-counter-styles/counter-style-at-rule/disclosure-closed-extends-direction-003.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<meta charset="utf-8">
<title>Counter style extending disclosure-closed responds to 'direction' (vertical-rl)</title>
<link rel="author" title="Ananya Anand" href="mailto:t-anaanand@microsoft.com">
<link rel="mismatch" href="disclosure-closed-extends-direction-003-notref.html">
<link rel="stylesheet" href="/fonts/ahem.css">
<meta name="flags" content="ahem">
<meta name="assert" content="disclosure-closed points toward the inline-end, so a counter style extending it renders differently under direction:ltr than under direction:rtl in vertical-rl writing mode.">
<style>
@counter-style closed-ext { system: extends disclosure-closed; }
.cell {
width: 160px; height: 160px;
display: flex; align-items: center; justify-content: center;
font: 100px/1 Ahem;
}
.m::before { content: counter(x, closed-ext); }
</style>
<div class="cell"><span class="m" style="writing-mode: vertical-rl; direction: ltr"></span></div>