[Bug] Site title and hamburger menu overlap in mobile view

[rpodcast]

I pulled up the sample castanet site on my LG G4 android phone (browser is chrome for android) and I saw that the site title HugoCast and the "hamburger" icon (I'm sure there's a more technical name for this) were overlapping each other in the top center of the page view. Here's a screenshot

I'm fairly certain this only happened after your recent update to bootstrap 4 because I viewed my podcast site r-podcast.org on my phone and the site title is left-justified while the hamburger menu is right-justified.

Reproduction Steps: Load site in a small viewport

[mattstratton]

Oddly, this only seems to happen in Chrome with dev tools (I saw it there in the smaller viewport emulator) but not on mobile safari. I'll investigate it shortly.

[ghost]

Your issue doesn't follow our guidelines. Please fix the following:

• Issue description must include reproduction steps (?)

Click here for details.

Thank you! 🙏

_{This comment was made by GitMagic – Magically enforcing your contribution guidelines.}

[mattstratton]

@Thercast - ignore the aggressive bot :)

[ghost]

Thank you, everything looks good now!

[mattstratton]

So I did find a workaround - the issue comes up when the nav contains a container, to make the navigation align with the middle container. When I remove that container, it makes the hamburger menu work fine.

I am thinking I'll commit this particular fix and open a new issue to get the navigation aligned properly.