Combine header right menu and search box

Community Forums Forums Design Tips and Tricks Combine header right menu and search box

This topic is: resolved

This topic contains 5 replies, has 2 voices, and was last updated by  AC 1 year, 4 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #54085

    ACBellevue
    Participant
    Post count: 28

    I am trying to get the nav menu in the header right widget in line with the search box. This would be similar to http://demo.studiopress.com/outreach/

    I tried some CSS tweaks in the forums but can’t quite hammer it out. If there is a way to get rid of the solid black line across the screen, that would be a bonus. Thanks!

    http://www.assumptionchurch.org
    #54117

    AC
    Blocked
    Post count: 7712

    You need to widen the header right widget area:

    [css]#header .widget-area {
    float: right;
    font-size: 20px;
    padding: 27px 0 0 15px;
    width: 700px;
    }[/css]

    Change 700 to about 870, but you will also need to adjust the Title Area on the left. Reduce 430 to about 150.

    #title-area {
    float: left;
    overflow: hidden;
    width: 430px;
    }

    #54127

    ACBellevue
    Participant
    Post count: 28

    Very nice, thank you. Could I trouble you for a suggestion on getting them more in line too?

    #54128

    AC
    Blocked
    Post count: 7712

    Look for this:

    [css]#header .searchform {
    float: right;
    margin: 0;
    }[/css]

    Change the margin to:

    [css]margin: 40px 0 0 ;[/css]

    #54131

    ACBellevue
    Participant
    Post count: 28

    That is perfect! Thank you!

    #54133

    AC
    Blocked
    Post count: 7712

    You’re welcome.

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

You must be logged in to reply to this topic.