<!DOCTYPE html>
<style>
.contain { contain: style; }
.reset { counter-reset: c;}
.increment::before { content: counters(c, "."); }
.increment { counter-increment: c; }
</style>
<div class="increment"></div>
<div class="contain">
<dialog id="test">
<div class="increment"></div>
</dialog>
</div>
<div class="increment"></div>
<script>
document.getElementById("test").showModal();
</script>