Codebase Browser
chromium
Go to App

chromium/third_party/blink/web_tests/html/details_summary/details-marker-style.html 

<!DOCTYPE html>
<body>
<style>
/* For ::marker, padding, border, width, and height should not work.
   https://drafts.csswg.org/css-lists-3/#marker-properties */
summary.withpadding::marker {
    padding: 8px 16px 24px 32px;
    border-width: 8px 16px 24px 32px;
    border-style: solid;
    border-color: lime;
}

summary.nopadding::marker {
    border: 8px solid lime;
    width: 48px;
    height: 24px;
}

.zoomed {
  zoom: 2;
}

details {
    font-size: 24px;
}

div {
  display: inline-block;
  width: 40%;
}
</style>
<div style="-webkit-writing-mode: horizontal-tb;">
<details><summary class="withpadding">Summary</summary></details>
<details class="zoomed"><summary>Summary</summary></details>
</div>
<div style="-webkit-writing-mode: vertical-rl; -webkit-text-orientation: sideways-right;">
<details><summary class="withpadding">Summary</summary></details>
<details class="zoomed"><summary>Summary</summary></details>
</div>

<div style="-webkit-writing-mode: horizontal-tb;">
<details><summary class="nopadding">Summary</summary></details>
<details class="zoomed"><summary>Summary</summary></details>
</div>
<div style="-webkit-writing-mode: vertical-rl; -webkit-text-orientation: sideways-right;">
<details><summary class="nopadding">Summary</summary></details>
<details class="zoomed"><summary>Summary</summary></details>
</div>
</body>