Menue-Item-2 in DropDown
CODE
×
HTML
<a class='menue-item-dd v2' href='#'><span>Mein Postfach (3)</span></a>
CSS
a.menue-item-dd.v2 { display:block; position:relative; color: var(--black); font-size: 21px; line-height: 25px; font-family: 'Roboto'; font-style: normal; font-weight: 300; letter-spacing: 0.01rem; word-spacing: 0.025rem; padding-top: 21px; padding-right: 60px; padding-bottom: 21px; padding-left: 25px; width: content-fit; min-width: 330px; height: 68px; } a.menue-item-dd.v2:before { content: ' '; position: absolute; width: 12px; height: 18px; right: 25px; top: 25px; background-size: 12px 18px; -webkit-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iYXJyb3ctcmlnaHQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgOCAxMiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgOCAxMjsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KICAgIDxnIGlkPSJhcnJvdy1yaWdodF8iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgLTY0LjkyOSkiPg0KICAgICAgICA8ZyBpZD0iYXJyb3ctcmlnaHRfXyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCA2NC45MjkpIj4NCiAgICAgICAgICAgIDxwYXRoIGlkPSJhcnJvdy1yaWdodF9fXyIgY2xhc3M9InN0MCIgZD0iTTAuOSwxLjNMNS43LDZsLTQuOCw0LjdsMC43LDAuN0w3LjEsNkwxLjYsMC42TDAuOSwxLjN6Ii8+DQogICAgICAgIDwvZz4NCiAgICA8L2c+DQo8L3N2Zz4='); background-repeat: no-repeat; background-attachment: scroll; background-position: center center; background-size: auto; } a.menue-item-dd:hover > span, a.menue-item-dd:focus > span { border-bottom: 1px solid #000; } a { color: var(--black); } a:hover, a:focus { color: var(--black); }
JS
Menue-Item-2 in DropDown
Erstellt: 26.11.2024 - 09:58 Uhr
Letzte Änderung: 26.11.2024 - 09:58 Uhr
×
Mein Postfach (3)