Cutting off my logo at lower resolutions

[justanofxhobo]

Hi guys,

I’m working on my website and have run into a snag. I am converting over a pre-made theme and I am having some complications when you change the resolution. Everything looks great at a higher resolution. However when you switch to 1024 the logo gets chopped off right in the center. I have tried to play with the margins to get it to look right but it just ends up bleeding into the nav bar.

The site address is http://wonderlandspecialties.com/index.html

h1.navbar-brand_ is the class that I am trying to modify I believe… if there was something that I could add to that class under @media (max-width: 1387px) and (min-width: 992px) to fix it in those resolutions everything would look solid. (I plan on changing it to that because that is when the logo starts to get chopped.) I am only a novice when it comes to CSS so I hope I don’t sound like a total noob! Please help! I can supply the external CSS if needed. Thanks in advance!

[Paulie_D]

It’s partly because the logo-box is absolutely positioned which is often a responsive issue.

I see you have negative margin on the logo at the size you mentioned…try playing with that…of course, that may lead to additional changes to get everything else to fit properly.

[Author]

Posts