xxxxxxxxxx
.dropdown__menu {
// ... existing styles
position: absolute;
// Pull up to overlap the parent list item very slightly
top: calc(100% - 0.25rem);
// Use the left from absolute position to shift the left side
left: 50%;
// Use translateX to shift the menu 50% of it's width back to the left
transform: translateX(-50%);
}
xxxxxxxxxx
.dropdown {
position: relative;
.dropdown__menu {
background-color: #fff;
border-radius: 4px;
box-shadow: 0 0.15em 0.25em rgba(black, 0.25);
padding: 0.5em 0;
min-width: 15ch;
a {
color: #444;
display: block;
padding: 0.5em;
}
}
}