Home › Forums › CSS › Align nav bar vertically – help needed › Reply To: Align nav bar vertically – help needed
November 7, 2015 at 11:34 am
#234683
TheDoc
Member
There are a couple of different issues here causing these to be misaligned. The first is an easy fix: <ul>
by default has a padding-left
applied to it. It doesn’t appear as though you’ve removed that. That’s as easy as:
.site-nav__list {
padding-left: 0;
}
The other problem is that .site-nav__list-item
has margin-left: 60px
applied to all items. Unfortunately, that is going to cause things to be misaligned, too. You’ll want to do something like this:
.site-nav__list-item:not(:first-child) {
margin: 0 0 0 60px;
}
This will apply a margin-left of 60px to all list items except the first child.