Can I change header height on home page only?

  • Author
  • #1017072

    I changed the header height in CSS to accommodate my nice tall header (990×499) which looks great on my home page. However, I’d like to use a normal-height header (990×180 in Coraline) on all other pages and posts. When I set a normal-height header as the Featured Image on a secondary page, there’s a big gap between the bottom of the header and the beginning of the body text on the page. Clearly, I need to enter some kind of conditional statement that changes the header height *only* on the home page. Is this do-able in CSS?

    The blog I need help with is


    I checked and it looks like you’ve removed the large header image from the home page for now. If you’d like to add that back and post another reply here, I’d be happy to help you take a closer look.

    The solution I would use for this problem would be to replace the header image JUST on the home page with the larger image. If you’d like to try that option, please provide a link to the header image from your media library in a reply here.


    Here’s the link to my original, tall header. If I could feature this just on the home page, that would be swell.×479.jpg


    Here is a CSS example that will replace the header image just on the home page in the Coraline theme:

    .home #branding img {
    	display: none;
    .home #branding > a {
    	display: block;
    	height: 479px;
    	margin-top: 30px;
    	background: url( no-repeat;

    That worked beautifully! Thank you very much!!


    Cheers :)

The topic ‘Can I change header height on home page only?’ is closed to new replies.