Space between header and content

Community Forums Forums Design Tips and Tricks Space between header and content

This topic is: not resolved

This topic contains 1 reply, has 2 voices, and was last updated by  braddalton 1 year, 1 month ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #52429

    amomandherblog
    Participant
    Post count: 5

    So I got so aggravated with what I was doing before that I started over completely. Now I have another problem. I have a big space between the header area and the content area…something to do with the nav bar, I think. I’m not sure if I’m missing something in the css or if it’s something in the functions file. But that big space is ugly and needs to go. HELP! It can be seen here:

    http://coloradoblonde.com

    Thanks for any help or suggestions.

    #52494

    braddalton
    Participant
    Post count: 9784

    The best way to solve problems like this when you are building your own site is to install the web dev tool, Firebug.

    This enables you to inspect different HTML elements and make changes in real time to your CSS to see what happens.

    It may have something to do with the height of your header area. It may be the padding.

    Line 254 shows your header height is 280 px. You can change this in your child themes style.css file and your functions.php file.
    [css]
    .header-full-width #title-area, .header-full-width #title, .header-full-width #title a {
    height: 280px;
    width: 1022px;
    }
    [/css]

    Functions shows 120
    [php]
    /** Add support for custom header */
    add_theme_support( ‘genesis-custom-header’, array( ‘width’ => 960, ‘height’ => 120 ) );
    [/php]

    These height values should be the same.

    Looks like you have changed the width from 960 to width: 1022px.

    Also, this height value should be the same as your actual header image height

    This code shows 120px
    [css]
    #header {
    background: url(images/header.png) no-repeat;
    height: 120px;
    width: 960px;
    }
    [/css]

    So there’s 3 values ( 2 in CSS) and 1 in your functions file which should match the actual height of your header.

    You could also add a gallery of images to your header rather than an image which looks like it contains a gallery.

    Create a gallery using the native wp gallery shortcode and add the shortcode to a function like this:

    What is the actual height of your header image?


Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.