Form Buttons
CODE
×
HTML
<div class='next-back-buttons'> <button class='go-back'><img src="img/go-back.svg" style="margin-right:13px;height:19px;width:auto;vertical-align:middle;margin-bottom: 1px;"><span>Zurück</span><img src="img/go-back.svg" style="margin-left:9px;height:19px;width:auto;vertical-align:middle;margin-bottom: 1px;"></button> <button class='go-next'><img src="img/right-arrow-white.svg" style="margin-right: 10px;height:19px;width:auto;vertical-align:middle;margin-bottom: 1px;"><span>Weiter</span><img src="img/right-arrow-white.svg" style="margin-left: 17px;height:19px;width:auto;vertical-align:middle;margin-bottom: 1px;"></button> </div>
CSS
button.go-next { text-align:center; color: var(--white); font-family: 'Roboto'; font-style: normal; font-weight: 500; font-size: 16px; line-height: 26px; line-height: 125%; background-color: rgba(78,78,78,1); display: inline-block; height: 49px; border-radius: 49px; border: none; padding: 0 30px 0 0px; vertical-align: middle; margin: 40px 30px 40px 0; -webkit-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; cursor: pointer; overflow: hidden; } button.go-back { overflow:hidden; text-align:center; font-family: 'Roboto'; font-style: normal; font-weight: 500; font-size: 16px; line-height: 26px; line-height: 125%; background-color: var(--white); color: rgba(112,112,112,1); display: inline-block; height: 49px; border-radius: 49px; border: 1px solid #4E4E4E; padding: 12px 0px 12px 30px ; vertical-align: middle; margin: 0 30px 0 -1px; -webkit-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; cursor: pointer; } @media screen and (max-width: 767px) { button.go-next { margin-top: 20px; margin-right: 0; margin-bottom: 20px; margin-left: 0; } button.go-back { margin-top: 20px; margin-right: 0; margin-bottom: 20px; margin-left: 0; } }
JS
Form Buttons
barrierefrei
Letzte Änderung: 25.05.2023 - 14:27 Uhr
×
Zurück
Weiter