Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Rounded box-shadow on square box

With this:

div {
    width: 200px;
    height: 100px;
    background-color: green;
    box-shadow: 0px 0px 15px #000
}

I get a rectangle with drop shadow. See https://jsfiddle.net/df9dfev5/ The problem is that the shadow has rounded corners. How can this be avoided?

like image 334
EasierSaidThanDone Avatar asked Nov 20 '25 14:11

EasierSaidThanDone


1 Answers

Less blur and lighter color maybe like this

https://jsfiddle.net/df9dfev5/3/

 div {
    width: 200px;
    height: 100px;
    background-color: green;
    -moz-box-shadow: 0 0 5px 5px #666;
    -webkit-box-shadow: 0 0 5px 5px #666;
    box-shadow: 0 0 5px 5px #666;
}

Look at this article http://www.css3.info/preview/box-shadow/


Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!