<p>
<span>An inline element with the default box-decoration-break: slice.</span>
</p>
<p>
<span class="clone">An inline element using box-decoration-break: clone.</span>
</p>
p {
max-width: 150px;
line-height: 2;
}
span {
background-color: #002856;
color: #fff;
border-radius: 0.5em;
border: 2px solid black;
}
.clone {
box-decoration-break: clone;
}
body {
font-family: Roboto, sans-serif;
padding: 2em;
}
This Pen doesn't use any external JavaScript resources.