510 views
1.btn { 2 width: 130px; 3 height: 40px; 4 position: relative; 5 display: flex; 6 align-items: center; 7 justify-content: center; 8 gap: 10px; 9 letter-spacing: 2.5px; 10 text-transform: uppercase; 11 border: 1px solid black; 12} 13 14.btn, 15.socials { 16 border-radius: 20px; 17 background-color: transparent; 18 filter: drop-shadow(1px 1px 3px rgba(122, 122, 122, 0.808)); 19} 20 21.socials { 22 position: absolute; 23 /* border-bottom: 0.2px solid black; */ 24 width: 100%; 25 height: 100%; 26 display: flex; 27 align-items: center; 28 justify-content: space-around; 29 list-style: none; 30 top: 0; 31 left: 0; 32 transition: .2s linear; 33 opacity: 0; 34 visibility: hidden; 35} 36 37.btn:hover > .socials { 38 opacity: 1; 39 visibility: visible; 40 top: -120%; 41}
boryanakrasteva
Boryana
MIT License