Suits Theme – Header Full Length?

• 

  bobbyhearn · Member · Sep 9, 2015 at 8:47 am

  • Copy link
  • Add topic to favorites

  Pardon if this is a dumb question, I’m no CSS wiz. According to the Suits theme page, the length of the main container is 960 pixels, while both sidebars are 220. This adds up to a grand total length of 1400 pixels.

  Is it possible to upload a header that extends the full length of the webpage (1400L x 220W) without throwing everything else (nav bar, columns, etc.) off?

  Website is fivestarsoda.com. Thanks.

  The blog I need help with is: (visible only to logged in users)

• 

  g471n · Member · Sep 9, 2015 at 9:53 am

  • Copy link

  Hi bobbyhearn

  The theme seems to save the header image as 960px wide when you select a header image.

  I think we can override this with some custom CSS. If you upload an image that is 1400px x 220px to your media library and post the url for the image here I can work out the CSS for you.

• 

  bobbyhearn · Member · Sep 9, 2015 at 9:56 am

  • Copy link

  Sure thing. This is totally just a test image, but it is the correct dimensions.

  

  Thanks.

• 

  g471n · Member · Sep 9, 2015 at 9:57 am

  • Copy link

  To find the URL for the image:

  Select Media > Library – select the image and a window will open with the image info on the right hand side. Copy the URL – http:// etc. and post it here.

• 

  g471n · Member · Sep 9, 2015 at 10:04 am

  • Copy link

  Try adding this custom CSS.

  .site-header {
      background: #000 url(https://fivestarsoda.files.wordpress.com/2015/09/banner-test.jpg) no-repeat scroll top;
  }

  To add custom CSS

  Select Appearance > Customize > CSS from your Admin Dashboard and enter the custom CSS there.

  You need to be on the WordPress.com Premium Plan for custom CSS to save.

• 

  bobbyhearn · Member · Sep 9, 2015 at 9:56 pm

  • Copy link

  @g471n

  This is really close to working. There’s probably 20-30 pixels of empty space on both sides of the banner after this CSS. I’m really trying to make it stretch completely the length of the site though.

• 

  bobbyhearn · Member · Sep 10, 2015 at 9:03 pm

  • Copy link

  Anyone have any other suggestions?