• Nov 28, 2024 •shaiRos
0 likes • 6 views
button::after { content: ""; position: absolute; bottom: 0; /* Position underline at the bottom */ left: 50%; /* Start the underline in the middle */ transform: translateX(-50%); /* Center it horizontally */ width: 0; /* Adjust width relative to the button's content */ height: 4px; background-color: #007bff; /* Blue underline */ border-radius: 2px; /* Optional: Rounded corners for the rectangle */ } button.selected::after { width: 90%; /* Final width when the button is selected */ transition: width 0.3s ease; /* Smooth animation for width */ }