header / navbar wrap covers text on page

[MathewBiddle]

See

[ocefpaf]

What browser are you using? It doesn't happen on mine:

I tested it on Chrome, Chromium and Firefox. All worked as expected. (Unless I had the wrong page there.

[MathewBiddle]

It depends on the screen size. If you were to zoom in on that page, the header would expand and cover text. It is dependent on the webpage header length. Not sure if it's fixable...

[ocefpaf]

Not sure if it's fixable...

I'm not an HTML expert but, in theory, in a well designed page that should not happen regardless of the size. Some objects should not be allowed to overlap. With that said, I have no idea how to fix and we are basing this on a pre-built theme. We can look if there are any related issues in the theme repo upstream.

When I tried to change size I noted that when the page "kicks-in" mobile mode, everything works as expect. A few inches before that we can see Home icon and title going over the other items in the navbar. Maybe the title is too long?

[mwengren]

It's definitely a bug in the responsive design of the Jekyll template. Mobile mode works well, you're right. It's the intermediate that's the issue.

I spent some time trying to troubleshoot that early on when we started using this template but couldn't figure it out.

Another solution is to shorten the content in either the page title (top left), or try to winnow down our menubars again, or remove the feedback link. That might be the easiest quick fix. We could put feedback in the footer instead. Basically, our dropdown menu list is too long for the template.