Center ul
dropdwon-menu {
left: 50%;
transform: translateX(-50%);
}
Mysterious Mantis
dropdwon-menu {
left: 50%;
transform: translateX(-50%);
}/* Either center the list directly or center the parent element */
ul {
text-align: center;
}
/* OR */
div .list {
text-align: center;
}
<div id="menu-centered">
<ul>
<li><a href="">My first item</a></li>
<li><a href="">My second item</a></li>
<li><a href="">My third item</a></li>
<li><a href="">My fourth item</a></li>
<li><a href="">My fifth item</a></li>
</ul>
</div>