Support » Themes and Templates » Custom header image size with full width page

  • Resolved JONvdHeyden


    Hello All

    I am a wee bit stuck. I am using child theme off twentyeleven. I have attempted to resize header image to 703 x 146 by adding this to my child theme functions.php:

    define( 'HEADER_IMAGE_WIDTH', apply_filters( 'twentyeleven_header_image_width', 703 ) );
    define( 'HEADER_IMAGE_HEIGHT', apply_filters( 'twentyeleven_header_image_height', 146 ) );

    Yet it remains resized. See here:

    I believe the culprit may be this in my child theme css:

    /* Full Width Screen */
    #page { max-width: 100%; }
    body {
    	padding: 0;

    Thanks in advance;

    [ Please do not bump, it’s not permitted here. ]

Viewing 1 replies (of 1 total)
  • JONvdHeyden


    Hello All

    With help of this forum I puzzled out that the resolution involved:

    Changing the page max width to none:

    #page {
    	margin: 0 0; /* from 2em auto */
            max-width: none; /* from 1000px */

    Changing header image properties:

    #branding img {
    	height: auto; /* from auto */
    	margin-bottom: -7px;
    	width: auto; /* from 100% */

    Changing the header background color:

    /* Change the header background colour */
    #branding {
    	background: #3e87ad

    And with a few other tweaks the site is coming along nicely.

    Thanks to all the regular forum contributors here. 🙂


Viewing 1 replies (of 1 total)
  • The topic ‘Custom header image size with full width page’ is closed to new replies.