CodePen

HTML

            
              <div class="box">
  <h1>box-shadow border</h1>
</div>
            
          
!

↑ Insert the most common viewport meta tag

CSS

            
              body{
  background: url('http://subtlepatterns.subtlepatterns.netdna-cdn.com/patterns/shattered.png');
}

.box{
  font-family:tahoma;
  box-sizing: border-box; 
  margin:70px auto 0;
  width:400px;
  text-align: center;
  background: #ebebeb;
  padding: 26px;
  
  box-shadow: 
    inset 0 0 0 10px #4486F4, 
    inset 0 0 0 12px white,
    0 6px 20px black;

/* the important part is

    box-shadow: 
      inset 0 0 0 12px #4486F4, 
      inset 0 0 0 14px white;

*/

}


            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              /*
css box-shadow border demo for css-tricks forum question: 

http://css-tricks.com/forums/discussion/21499/stylist-css-borde
*/
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................