title: box-shadow with different size on sides
body: <p>I have a <code>&lt;div&gt;</code> with borders on all sides using <code>box-shadow</code> CSS property.
  currently the thickness of the shadow was 5px on all sides.But i need these borders with thickness 5px on top and bottom,10 px on left and right sides.</p>
  
  <p>I know is possible to do this using <code>border-left,boder-right,border-top,border-bottom</code>.
  But i need find a solution to use <code>box-shadow</code>  only.</p>
  
  <p>Is it possible?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>div {
      width: 300px;
      height: 100px;
      background-color: yellow;
      box-shadow: inset 0px 0px 0px 5px #888888;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>