Create a "Heart" using CSS

Creating a heart in css is a little bit advanced idea, heavy to grasp. It is just a dead heart.

HTML part

<div id="heart"></div>

CSS part

                        #heart {
                                    position: relative;
                                    left: 80px;
                                height: 130px;
                                   width:140px;
                                     }

                        #heart:before, #heart:after {
                           position: absolute;
                      content: "";
left: 70px;
top: 0;
width: 70px;
height: 120px;
background-color:#056;
/*border-radius*/
-webkit-border-radius: 50px 50px 0 0;
-moz-border-radius: 50px 50px 0 0;
border-radius: 50px 50px 0 0;
/*transform*/
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
/*transform-origin*/
-webkit-transform-origin: 0 100%;
-moz-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
-o-transform-origin: 0 100%;
transform-origin: 0 100%;
                                           }

                     #heart:after {
left: 0;
/*transform*/
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
/*transform-origin*/
-webkit-transform-origin: 100% 100%;
-moz-transform-origin: 100% 100%;
-ms-transform-origin: 100% 100%;
-o-transform-origin: 100% 100%;
transform-origin: 100% 100%;
                      }

source: <a href="http://topgravity.com/">Top Gravity</a>