@corey87 I also use Chrome and your site looked fine. However, I can see a small issue with the logo when your browser is resized. When the browser is resized, the logo’s CSS code changes when the browser reaches 1180px or lower. When this happens the menu floats to the left, and the logo area shrinks in size which is the reason it appears cutoff. I’m guessing you have your chrome browser and your firefox browser opened up at different widths? Try making them all the same size and you should see that they all show the same result. You can make them wide, and then resize them to be narrow to see the issue.
To fix this, you’ll need to add this code – background-size: contain !important; to your CSS file around line 4453. It should look like this after you add the code –
.site-header .site-title a {
background-position: center top !important;
background-size: contain !important;
}
That will allow the Logo Image to resize/adjust in that area.
If you don’t want the menu to float to the left when the browser is resized to 1180px, then you can change the width to auto on line 4045 –
.content,
.site-header .widget-area {
width: auto;
}
By default it says 620px, so if you change that to auto it will work.
This only affects your logo and menu when the browser reaches 1180px all the way down to 1024px. So once the browser reaches 1024px when resized, the theme is developed to have the Logo and the Menu center…..this is designed for tablets, and then the next responsive section is for Mobile Phones.
If you need assistance finding these line numbers in your CSS file or adding them in I can login for you and make the 2 changes if you want (since it won’t take long). I would only need a temporary login to do it. It can be done pretty quickly, under 15 seconds. Just let me know
.
