Untitled

dabblet.css

body { padding: 10em; }
textarea { min-width: 40em; }

div {
  padding: 2em;
  border-left: 5px solid #c1c2c4;
  border-right: 5px solid #c1c2c4;  
  position: relative;
}

div::before, div::after { 
  position: absolute; 
  display: block; 
  content: ''; 
  height: 5px; 
  background-size: 5px 5px; 
  background-position: left top, right top;
  background-repeat: no-repeat;
  left:0; right: 0; 
}

div::before { 
  top: 0;
  background-image: 
    linear-gradient(#c1c2c4 20px, white 21px),
    linear-gradient(#c1c2c4 20px, white 21px);
}

div::after { 
  bottom: 0;
  background-image: 
    linear-gradient(#c1c2c4 20px, white 21px),
    linear-gradient(#c1c2c4 20px, white 21px);
} 

dabblet.html

<div>
<p><textarea>Resize me</textarea></p>
</div>

settings.json

{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}