How can I make it? (Shadows CSS3)

Question

I don't even mind how I can create it. Any ideas?

This is not how stackoverflow works. You have to of put some effort into what you're trying to do and then bring reasonable problems to the forum if you can't figure it out. Protip : shadows like this are probably best done with an image. — Bosworth99, Apr 15 '16 at 18:54
thanx guys. i just study CSS3 and found interesting shadows pic :) Sorry — Сергей, Apr 15 '16 at 18:57
http://www.w3schools.com/cssref/css3_pr_box-shadow.asp ... +1 to what Bosworth99 said - first search then ask. — kaskader, Apr 15 '16 at 19:49

score 1 · Accepted Answer · answered Apr 16 '16 at 06:39

use the below code for the shadow effect. better you use css than images for shadows effects. because css is easy to create,edit and load fastly. images are not easy to create,edit and to load fastly compared with the css.

    <div class="box effect2">
        <h3>Effect 2</h3>
    </div>


    .box h3{
    text-align:center;
    position:relative;
    top:80px;
}
.box {
    width:70%;
    height:200px;
    background:#FFF;
    margin:40px auto;
}

/*==================================================
 * Effect 2
 * ===============================================*/
.effect2
{
  position: relative;
}
.effect2:before, .effect2:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  box-shadow: 0 15px 10px #777;
  transform: rotate(-3deg);
}
.effect2:after
{
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

Reference Link

How can I make it? (Shadows CSS3)

1 Answers1