I’m using the following code to style my main navigation with dividers, but for some reason, the dividers are touching the parallax hero:

.main-navigation ul li, .secondary-navigation ul li {
  position: relative;
  display: inline-block;
  text-align: left;
  border-right: 1px solid;


How do I reduce the width of the divider, so it does not drop down so far?

I’ve attached a screenshot as evidence. Picture of dividers and hero.

Read more here: Main navigation dividers query


If you know the solution of this issue, please leave us a reply in Comment section, to update the question.

Wordpress related questions and answers: