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

WordPress

Posted by philallen
philallen
2,864 Points

Header Background Image Cut Off at Both Ends

Hello, I am using Wordpress for the first time and I am having a problem with the background graphic for the header. When I click, "Visit Site" from the Dashboard, the ends of the background graphic for the header are cut off. At first I thought it was because the graphic was 1500 pixels long and I was looking at the website on a 1366x768 display. However, when I adjusted the graphic to 1300x192 px and uploaded it to the website, there was no change. I don't know what to do next. I'm trying to do something very simple, but it isn't working the way I hoped. Below is some information on what I am using: +Twenty Thirteen Theme Version 1.1 +Chrome Version 30.0.1599.101 m +Windows 7 +No plugins activated(some were previously activated) If anyone has any ideas about what to check next, please let me know. Thank you in advance for your time and help.

5 Answers

Nathalie C
Nathalie C
2,594 Points
Nathalie C
Nathalie C
2,594 Points

The graphic is being loaded as a background image defined in your css here - .site-header and you have defined a width of 1600px. If you change this to 100% auto instead of 1600px auto, the image will scale with the width of the browser and not crop. I think this fixes it for you.

philallen
philallen
2,864 Points

Thank you Nathalie. You are correct about changing the .site-header css to 100% auto. My next challenge is finding the CSS code that you mentioned. It seems to be inline CSS in some file other than the main styles.css file for the theme. I'm still trying to find it. I need to go back and review the Wordpress Theme Development training videos here on Treehouse. Thank you for taking the time to look at my problem.

Véronique Bellamy
Véronique Bellamy
20,810 Points
Véronique Bellamy
Véronique Bellamy
20,810 Points

Well, do you have a link to the site?

philallen
philallen
2,864 Points
philallen
philallen
2,864 Points

Hi Jessica, Thanks for trying to look into my problem. The Wordpress website is currently on my local hard drive, but I am working on moving the website to a subdomain on my client's webhosting provider. As soon as I am successful with that and securing it, I will post the url and login credentials. Thanks again.

philallen
philallen
2,864 Points
philallen
philallen
2,864 Points

The website is now available online. The URL is: http://www.equity-title.com/wpdevelopment/ The username is: help The password is: treehelp Thanks.

philallen
philallen
2,864 Points
philallen
philallen
2,864 Points

Well...I ran out of time to work on this after looking at other sources. I decided to install and activate the Twenty Eleven Theme. That solved my problem for now. I may try the Twenty Twelve Theme in the future after I am used to modifying themes in Wordpress. Thank you all.