html - How to create a custom shapes using CSS? -


for eg. need able create key shape using css

enter image description here

jsbin convenience

you can try this:

#key {    margin: 50px 0 0 100px;    width: 200px;    height: 30px;    border-radius: 30px;    position: relative;    background: red;  }  #key:after {    content: '';    position: absolute;    bottom: 100%;    right: 20px;    height: 20px;    width: 50px;    background: red;  }  #key:before {    content: '';    position: absolute;    border: 30px solid red;    border-radius: 50%;    height: 60px;    width: 60px;    left: -100px;    top: 50%;    margin-top: -60px;  }
<div id="key"></div>


Comments

Popular posts from this blog

c# - System.NotSupportedException: Invalid setup on a non-virtual (overridable in VB) member -

powershell Start-Process exit code -1073741502 when used with Credential from a windows service environment -

c# - How to return WebClient() UploadFile() 302 Response -