dimanche 3 juillet 2016

How to get a border around this polygon?


I have created a shape with 5 corners using polygon as shown below.

enter image description here

This is the css needed to make it:

div {
    width: 280px;
    height: 280px;
    background: #1e90ff;
    -webkit-clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 0 48%, 0% 0%);
    clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 0 48%, 0% 0%);
    border: 3px solid black;
    border-bottom-left-radius: 15px;
    border-top-left-radius: 15px;
}

Unfortunately I cannot get it to add a black border all around the shape (it is missing on the right side). How would I do that?

I have created a fiddle here.


Aucun commentaire:

Enregistrer un commentaire