Horizontal Menu Overlapping

[jltjr]

I have a site that works fine on my monitor but NOT my clients old resolution monitor. The horizontal menu goes behind the LOGO as the window is made smaller. It eventually goes to the mobile phone menu at a certain point. How can I prevent this menu from ever going behind the logo with my CSS?

http://redlightelectronics.com/ffs/

[uxfed]

I’m guessing you’ve got a really high-resolution monitor if you’re not seeing overlap on yours. You may want to consider dragging your browser window in, just to see how it looks at various breakpoints (also a lot of people don’t browse with their browser window full-screen).

To answer your question though, replace “col-md-2 col-xs-12” with “col-md-auto col-xs-12” (the logo), and replace “col-md-8 col-xs-12” with “col-md col-xs-12” (the menu).

[jltjr]

Thank you, I did that and reduced the padding between the links. I do have a wide screen monitor so that does create some issues when I forget to view at different resolutions.

[Author]

Posts