Suits Header issue

• 

  afdaniels · Member · Jun 15, 2014 at 2:40 pm

  • Copy link
  • Add topic to favorites

  Hi, I am using the Suits theme and I am having an issue with the header. I have uploaded a header image but I need the black background to cover the width. Could someone help me out with this?

  http://theevergreensalon.com/

• 

  supportmyoffice · Member · Jun 15, 2014 at 5:27 pm

  • Copy link

  It looks like you resolved this. Is that correct?

• 

  designsimply · Member · Jun 16, 2014 at 7:23 pm

  • Copy link

  There are a few different ways to make an uploaded custom header image full width. Using the CSS3 rule “background-size,” you can set the image to be as large as possible while still covering as much of the container area as possible. Here is an example:

  .site-header {
  	background-size: contain;
  }

  You can find out more about background-size here https://developer.mozilla.org/en-US/docs/Web/CSS/background-size and here https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Scaling_background_images

  Another option would be to override the header image setup through the blog using CSS and make it a repeating background image like this:

  .site-header .home-link {
  	background: url(http://s.w.org/about/images/wp-dark-lo-bg.png) repeat-x;
  	min-height: 145px;
  	max-height: 145px;
  	max-width: 100%;
  }

  To try this yourself, replace the url() image link with your own image and adjust the height values to match the height of your image.

  When I reviewed http://theevergreensalon.com/ I found it is using WordPress, but it is not setup here at WordPress.com. Because of that, you should post any additional questions you have related to the Suits theme at http://wordpress.org/support/theme/suits

  Thanks and cheers!