Bottom menu changes to vertical instead of horizontal after J4 upgrade

dustyken

After updating a site with all of the updated content for Light Church and then upgrading to J4, everything looks great but the bottom menu went from horizontal to vertical. Is there anything I need to change to get it back to horizontal? Can't find a configuration option to do this.

saguaros

It due to the changes in markup of menu module in J4, you can add this custom css:

#s5_bottom_menu_wrap ul.mod-menu a:hover {
  text-decoration: none;
}

#s5_bottom_menu_wrap ul.mod-menu li {
  padding-right: 7px;
  padding-left: 7px;
  font-size: 1.1em;
  font-weight: 300;
  color: #747474;
  float: left;
  position: relative !important;
}

#s5_bottom_menu_wrap ul.mod-menu li a {
  font-size: 15px;
  color: #747474;
}

into the file: root/templates/your_light_church_template/css/custom.css (Create this file if it doesn't exist now)

dustyken

Thanks so much for the reply. I created the custom.css file, added the above code and then placed it in the directory specified. It's still displaying the menu vertically. Any additional help would be appreciated. Makes wonder if this particular template knows to look for a custom.css file since that file didn't exist prior to this.

Thanks

dustyken

Never mind. It's working on the live site for some reason but not on this test site.

Thanks so much for your help. This can be closed.