Is there a way to center the navigation items and align a quick login form to the right of the navigation bar using just HTML and CSS? I've tried float: right and display: inline-block, but haven't had any success.
Any suggestions or tips on how to achieve this would be greatly appreciated. Thank you!
nav#navBar {
text-align: center;
margin-top: -8px;
margin-left: -8px;
border-bottom: 2px solid #191919;
}
nav#navBar ul {
list-style-type: none;
padding: 0;
margin: 0;
}
nav#navBar ul li {
font-weight: 600;
font-size: 14px;
margin-top: 5px;
display: inline-block;
font-family: 'Raleway';
font-variant: small-caps;
}
nav#navBar ul li a, visited {
color: #191919;
text-decoration: none;
padding: 25px;
display: block;
}
nav#navBar ul li a:hover {
color: grey;
margin-bottom: -2px;
border-bottom: 2px solid grey;
}
nav#navBar ul.loginForm {
display: inline-block;
float: right;
}