Reply To: header logo does not integrate well

Your title area (logo) and nav are too wide. Both the title area and widget area can’t both fit inside of that space unless you decrease the size of one or the other. Your title area is set at 400px (which is almost half) and your nav area is around 630px. The size of that entire space is only 960px, so by adding both of those together it would equal over 1000px. So you’ll have to either make the logo area smaller or decrease the nav.

I took a screenshot to give you a visual of what I’m talking about – http://i.imgur.com/R9xxyhP.png

The blue part that is highlighted is the logo’s hyperlink (the clickable area). Once you decrease that, then the navigation will be able to fit inside that area. Which means it will look like this – http://i.imgur.com/jvfQM3a.png

You can adjust the size of the logo’s hyperlink (clickable blue area) on line 250 in your css –

.header-image #title-area, 
.header-image #title, .header-image #title a {
    display: block;
    float: left;
    height: 100px;
    overflow: hidden;
    padding: 0;
    text-indent: -9999px;
    width: 400px;
}

The widget area’s width is set at auto by default. You can add a width to it if you want on line 240 in your css, but you may not need to –

#header .widget-area {
    float: right;
    padding: 20px 0 0;
    width: auto;
}

Keep in mind, you can still use the Primary Navigation area instead of the header right widget area if you want to. The Primary Nav would show up under the logo area, starting from the left.

Any reason why you’re not using the latest version? It looks like you’re using version 1.0

---