CSS box-decoration-break property example at PNLdev

Run
<!DOCTYPE html>
<html>
<head>
<style>
    span {
    border: 10px solid blue;
    padding:  0em 1em;
    border-radius: 20px;
    font-size: 18px;
    line-height: 2;
}
    span.ex1 { 
    -webkit-box-decoration-break: clone;
    -o-box-decoration-break: clone;
    box-decoration-break: clone;
}
    span.ex2 { 
    -webkit-box-decoration-break: slice;
    -o-box-decoration-break: slice;
    box-decoration-break: slice;
}
</style>
</head>
<body>
    <h1>box-decoration-break property example</h1>
    <h2>box-decoration-break: clone:</h2>
    <span class="ex1">CSS<br>is<br>easy<br>to learn</span>
    <h2>box-decoration-break: slice (default):</h2>
    <span class="ex2">CSS<br>is<br>easy<br>to learn</span>
    <p><strong>Note:</strong> IE/Edge do not support the box-decoration-break property.</p>
</body>
</html>