Need help? Check out our Support site, then


"Fresh and Clean" Header Customization

  1. In the process of customizing template and noticed an issue...

    I have looked over the template css file, forums and google without any lead on how to be able to customize the size of the header image within the "Fresh and Clean" template. Is this something hard coded in the template? The area of concern is with mobile devices, more importantly the ipad. The header border appears to be responsive and scales but the image does not becoming cut off and looking funny.

    Is there a css selector available to be able to control or adjust this?

    Thanks in advance...

    The blog I need help with is blogdotsnehtadotcom.wordpress.com.

  2. The header image in the Fresh and Clean theme is setup using the CSS "background" property, and so it is something you can change. The only caveat in this case is that the "background-size" property is CSS3 and so it's not supported in all older browsers. Here is an example that will work in all up-to-date browsers:

    #branding {
    	background-size: contain;
    	background-position: center;
    }
    @media (max-width: 650px) {
    	#branding, .header-link {
    		min-height: 80px;
    	}
    }
    @media (max-width: 480px) {
    	#branding, .header-link {
    		min-height: 60px;
    	}
    }

    See this table for browser compatibility info:
    http://caniuse.com/background-img-opts

Topic Closed

This topic has been closed to new replies.

About this Topic