Is there a way to center the text within my navigation and ensure it remains centered across all resolutions (left at 1920x1080, centered at 1420)?
I understand that much of this code is inefficient and not working correctly, but for now I just want to fix it before cleaning it up.
/* Navigation Menu */
.main-navigation {
text-align: center;
margin-top: 24px;
width: 958px;
display: inline-block;
}
.main-navigation li {
text-align: center;
font-size: 16px;
color:#fff;
}
.main-navigation a {
color: #fff;
}
.main-navigation a:hover {
color: #fff;
}
.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
display: none;
}
.main-navigation ul.nav-menu.toggled-on,
.menu-toggle {
display: inline-block;
}
.nav-menu {
margin: 0 auto;
width: 100%;
height: 5px;
padding-left: 20%;
left: 0px;
top: 20px;
position: fixed;
display: inline-block;
background: none;
DEV server is experiencing some issues, if you encounter error 500, please refresh a couple of times.