Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

Design

Ingrid Bardales
Ingrid Bardales
10,616 Points

would love input re my project

Hi guys I can't believe I'm actually building my first website! I know it's small compare to some of the sites some of you pros build but you gotta start somewhere. My friend just opened a grooming salon and business is a little slow so I'm hoping this will bring his store some traffic. I'm including a link to Dropbox. The two main issues I'm struggling with are with Print Preview, inside the main header is the site's name but when I apply the @media print and set the background to transparent, there is a big chunk of space where the main header and no h1. I tried applying .main-header h1 and setting the text to align to center but that doesn't work. The other issue is the image in the main nav (it's suppose to be a clasp) when I make the viewport smaller it does some quirky hiding/scrolling behind the main-nav li, I don't' want it to do that. Sorry this is so long, also i would love any and all input from you pros. Thanx a million! Ingrid

https://www.dropbox.com/sh/x6afzt9lu3t28qe/AAC6Ig34sjJFWH9q1pfmJh02a?dl=0

2 Answers

Jason Taylor
Jason Taylor
3,059 Points

Without looking, instead of setting the background to transparent, try collapsing it. I would say just use display:none in your print stylesheet but I assume the h1 resides in the header? So play with the height of the background or remove the header background image if there is one that is setting the height/width. It sounds like all you are after from the header is the H1 when printed so you should be trying to remove whatever is dictating the empty height/width.

Ingrid Bardales
Ingrid Bardales
10,616 Points

hi Jason, I've tried your recommendations but still no results, gonna keep playing arounf with it. Thanx!