Edit in JSFiddle

<div id="heart"></div>
/* source: http://stackoverflow.com/a/17386187*/
#heart{
    width: 100px;
    height: 90px;
    margin-top: 10px;
    position: relative;
}
#heart:before{
    position: absolute; 
    content: ""; 
    left: 50px; 
    top: 0; 
    width: 52px; 
    height: 80px; 
    background: red; /* assign a nice red color */
    border-radius: 50px 50px 0 0; /* make the top edge round */ 
}
#heart:after{
    position: absolute; 
    content: ""; 
    left: 50px; 
    top: 0; 
    width: 52px; 
    height: 80px; 
    background: red; /* assign a nice red color */
    border-radius: 50px 50px 0 0; /* make the top edge round */ 
}
#heart:before{
    -webkit-transform: rotate(-45deg); /* 45 degrees rotation counter clockwise */
       -moz-transform: rotate(-45deg); 
        -ms-transform: rotate(-45deg); 
         -o-transform: rotate(-45deg); 
            transform: rotate(-45deg); 
    -webkit-transform-origin: 0 100%; /* Rotate it around the bottom-left corner */
       -moz-transform-origin: 0 100%; 
        -ms-transform-origin: 0 100%; 
         -o-transform-origin: 0 100%; 
            transform-origin: 0 100%;
}
#heart:after { 
    left: 0; /* placing the right part properly */
    -webkit-transform: rotate(45deg); /* rotating 45 degrees clockwise */
    -moz-transform: rotate(45deg); 
    -ms-transform: rotate(45deg); 
    -o-transform: rotate(45deg); 
    transform: rotate(45deg); 
    -webkit-transform-origin: 100% 100%; /* rotation is around bottom-right corner this time */
    -moz-transform-origin: 100% 100%; 
    -ms-transform-origin: 100% 100%; 
    -o-transform-origin: 100% 100%; 
    transform-origin :100% 100%; 
}