header and menu alignment

  • Resolved tassiepete

    (@tassiepete)


    10 years, 12 months ago

    Hi,

    I’m trying to get the header image and the left-hand justified menu (as per below) to both align responsively. Currently the header is fixed to what ever indentation that I put in the top_nav section, while the menu adjusts responsively.

    .top_nav { margin-left: 0px; } .menu_main { float: left; width: 75%; } .wrapper, #page { margin: 0px; width: 75%; } .logo{ display: none; } .copyright_info { background: none repeat scroll 0 0 #fff; }

Viewing 7 replies - 1 through 7 (of 7 total)
  • weblizar_support

    (@weblizar_support)

    10 years, 12 months ago

    Hi,

    Share the website URL and Screen-Shot also.

    Thanks

    Thread Starter tassiepete

    (@tassiepete)

    10 years, 11 months ago

    sorry for the delay, was waiting for the DNS to go through

    http://campus.woodsolutions.com.au/

    weblizar_support

    (@weblizar_support)

    10 years, 11 months ago

    Hi,

    Go to Dashboard Admin Panel >> Appearance Menu >> Theme Options >>

    General Option >> Custom Css.

    Now write the given below CSS rules into custom CSS editor.

    .top_nav .right { margin-left: 167px; }
    .container { margin-left: -90px; }

    Now save the changes.

    Thanks

    weblizar_support

    (@weblizar_support)

    10 years, 11 months ago

    Hi,

    Sorry for inconvenience.

    Use this solution instead of above solution:

    Go to Dashboard Admin Panel >> Appearance Menu >> Theme Options >>

    General Option >> Custom Css.

    Now write the given below CSS rules into custom CSS editor.
    .menu_main {
    margin-left: -275px;
    }

    Now save the changes.

    Thanks

    Thread Starter tassiepete

    (@tassiepete)

    10 years, 11 months ago

    Hi,
    I have used the second option that you provided (and tested the first).

    the second option works better, but when the web browser become narrow the menu goes off the left hand side of the page now. if it is much wider is spaces nicely with the header image as it should.

    I changed the pixel spacings around a few times, but I couldn’t seem to get it to match well.
    cheers,

    weblizar_support

    (@weblizar_support)

    10 years, 11 months ago

    Hi,

    write the given below CSS rules into custom CSS editor.

    .menu_main {
    float: right;
    width: 100%;
    }
    #header .container {
    float: left;
    }
    .top_nav {
    margin-left: 30px;
    }

    And save the changes.

    Note: We are not responsible for theme responsiveness.

    Thanks

    Thread Starter tassiepete

    (@tassiepete)

    10 years, 11 months ago

    thanks for that,

    not quite perfect, but worked pretty much correctly

    thanks again,
    please mark as resolved

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘header and menu alignment’ is closed to new replies.