Send Button
CODE
×
HTML
<button class='submit'><span style="margin-right:10px">Senden</span> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="19" height="18" viewBox="0 0 22.5 21.5" style="enable-background:new 0 0 22.5 21.5;" xml:space="preserve" class="first"> <style type="text/css"> .st0{fill:#fff;} </style> <path class="st0" d="M22.3,0.5c-0.2-0.5-0.8-0.6-1.3-0.4L0.5,10.8C0.3,11,0.1,11.1,0,11.4c-0.1,0.2-0.1,0.5,0,0.7 c0.1,0.2,0.3,0.4,0.5,0.5L8,15.1v5.5c0,0.5,0.4,0.9,0.9,0.9c0.3,0,0.6-0.1,0.8-0.4l3.2-4.4l5.8,2c0.1,0,0.2,0.1,0.3,0.1h0 c0.5,0,0.9-0.3,0.9-0.8l2.5-16.9C22.4,0.9,22.4,0.7,22.3,0.5z M10.6,14l9.5-10.2l-1.9,12.8L10.6,14z M17.1,4.3l-8.4,9l-5.4-1.8 L17.1,4.3z"/> </svg></button>
CSS
button.submit { overflow:hidden; text-align:center; font-size: 16px; line-height: 26px; font-family: 'Roboto'; font-style: normal; font-weight: 500; line-height: 24px; background-color: rgba(78,78,78,1); color: var(--white); display: inline-block; height: 49px; border-radius: 49px; border: none; padding: 0px 34px 0px 36px; vertical-align: middle; margin: 40px 30px 40px -1px; transition: all 250ms ease-in-out; cursor:pointer; } button.submit:hover, button.submit:focus { -webkit-transform: scale(1.07); -ms-transform: scale(1.07); transform: scale(1.07); } @media screen and (max-width: 767px) { button.submit { margin-top: 20px; margin-right: 0; margin-bottom: 20px; margin-left: 0; } }
JS
Send Button
barrierefrei
Erstellt: 12.06.2024 - 09:49 Uhr
Letzte Änderung: 12.09.2024 - 14:40 Uhr
×
Senden