That’s great – thank you for sending the reply on how to do this – the video and screenshots had a couple of different ways of doing it, but the one with screenshots works.. Although the menu is still broken (some items being pushed onto another line).
I’ve been looking at the code and found that there’s something strange that happens to the css when <style> is located above <div class="menu-main-menu-container">:
The css class .header-type-3 .logo-with-menu + div, .header-type-4 .logo-with-menu + div is not being applied to the div <div class="menu-main-menu-container">.
So therefore the css attributes display: table-cell; vertical-align: middle; aren’t being used. I’ve found making an over-ride of a new css class called .menu-main-menu-container and apply the above css attributes to make the menu work as desired. Hooray!
I’m not sure if this will break anything else in the mean time though?
Hopefully it may help with others that could have the same trouble too, and possibly be used as a fix in the future 🙂