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?
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).