Rounded Corner 3px - after-before

HTML

<div class="rounded-corner-3">
Tento zaobleny div se roztahuje dle delky textu.
    
Tento zaobleny div se roztahuje dle delky textu.
    Tento zaobleny div se roztahuje dle delky textu.
    Tento zaobleny div se roztahuje dle delky textu.
    Tento zaobleny div se roztahuje dle delky textu.
    Tento zaobleny div se roztahuje dle delky textu.
    Tento zaobleny div se roztahuje dle delky textu.
    
    
</div>

CSS

* {
    margin: 0;
    padding: 0;
}

html, body{
    background: #11111;
}

.rounded-corner-3 {
    display: inline-block;
    background: #fff;
    border-left: 2px solid #ddd;
    border-right: 2px solid #ddd;
    position: relative;
    z-index: 2;
}

.rounded-corner-3:before{
    width: 100%;
    height: 100%;
    padding: 0 0 2px 0;
    border: 1px solid #ddd;
    border-left:0;
    border-right:0;
    display: block;
    content: " ";
    z-index: -1;
    position: absolute;
    top: -2px;
    bottom: 0px;
}

.rounded-corner-3:after{
    width: 100%;
    height: 100%;
    border: 1px solid #ddd;
    border-left:0;
    border-right:0;
    padding: 0 2px 0 0;
    display: block;
    content: " ";
    z-index: -1;
    position: absolute;
    top: -1px;
    left: -1px;
    bottom: 0px;
}