-3

Here is code i have tried but box shadow

div {
    -webkit-box-shadow: 0px 0px 10px #000;
    -moz-box-shadow: 0px 0px 10px #000;
    box-shadow: 0px 0px 10px #000;
}
<div>abc</div>

what i need is this, enter image description here , It is possible using background image but what i want to do this using css.

here is original image : enter image description here

Thank you

Prasanga
  • 1,008
  • 2
  • 15
  • 34
  • 3
    Possible duplicate of [How to get box-shadow on left & right sides only](http://stackoverflow.com/questions/11997032/how-to-get-box-shadow-on-left-right-sides-only) – aavrug Dec 30 '16 at 07:00
  • here i have attached image what i wanted finally i get an idea how to do this box shadow as per above answer. – Prasanga Dec 30 '16 at 07:07
  • Your image is just 23px?? – Jones Joseph Dec 30 '16 at 07:08
  • @Prasanga Do you really think anyone can understand anything from this small image? Btw good to hear that the link was helpful. – aavrug Dec 30 '16 at 07:09
  • yes and see there is gray color horizontal line in the image. that is what i wanted. – Prasanga Dec 30 '16 at 07:10

3 Answers3

1

@Prasanga Please find following code as per your requirement.

div {
    box-shadow: 12px 0 15px -4px rgba(31, 73, 125, 0.8), -12px 0 8px -4px rgba(31, 73, 125, 0.8);
    width: 100px;
    height: 100px;
    margin: 50px;
    background: white;
}
<div></div>
sanjay
  • 226
  • 2
  • 12
0

You can also try this ---

    div {
      width: 300px;
      height: 100px;
      background-color: yellow;
     box-shadow:0px 15px 0px 0px white,0px -15px 0px 0px white, 5px 0px 8px #444,-5px 0px 8px #444;
    }
<html>
  <head></head>
  <body>
    <div ></div>
  </body>
</html>
0

Very simple here :

div{
        background: white;
        box-shadow: -10px 0 8px -8px black, 10px 0 8px -8px black;
    }
 <div>abc</div>
Teshtek
  • 1,212
  • 1
  • 12
  • 20