<!DOCTYPE html>
<style>
.clone {
-webkit-box-decoration-break: clone;
box-decoration-break: clone;
}
.border {
border-left: solid 10px orange;
border-right: solid 20px purple
}
.padding {
padding-left: 10px;
padding-right: 20px;
}
div {
border: 5px solid blue;
}
.min {
width: min-content;
}
.max {
width: max-content;
}
</style>
<body>
<div class="min">
<span class="clone border">
line1 line2 line3
</span>
</div>
<div class="min">
<span class="clone padding">
line1 line2 line3
</span>
</div>
<div class="max">
<span class="clone border">
line1 line2 line3
</span>
</div>
<div class="max">
<span class="clone border">
line1 line2<br>line3
</span>
</div>
</body>