Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Brandon Brigham
Brandon Brigham
3,716 Points

Help with design layout

Hello,

Please visit the site I'm working on:

http://everythingpropertymanagement.com

So there is our logo at the top and it is overlaying on-top of the background image of Chicago skyline. I want it to look like this when looking at it through mobile and tablets. When you resize your browser a white bar appears behind the logo. How do I get rid of this white bar?

1 Answer

Jeff Lemay
Jeff Lemay
14,268 Points

At around 1160px you have a media query kick on that makes the header go from being absolutely position to relative positioned w/ a white background. When the element is absolutely positioned, it is taken out of normal flow and the big hero image goes to the top of the page. When it goes to relative, the header goes back into the normal flow and bumps the hero image below it.

Brandon Brigham
Brandon Brigham
3,716 Points

Thanks Jeff! I actually found a setting in the themes general settings that allowed me to adjust the responsive width and it was set at 1140px - I brought it down to the lowest 600px and it seems to have solved the issue - hopefully it doesn't make other aspects of the site look bad.

Thanks a lot for your time!