Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • June 17, 2014 at 11:16 pm #280256
    getHopeGlobal

    I am a new Enfold user, and new to css coding as well. I am developing a website that needs to have the menu bar run the full width of the screen even though the menu elements don’t fill that width.

    June 17, 2014 at 11:35 pm #280266
    Josue

    Hey!

    Try adding this code to the Quick CSS:

    #header_main_alternate .container, #header_main_alternate #avia-menu{
    width: 100%;
}
#header_main_alternate #avia-menu > li{
    width: 16.66%; /* You'd need to change this value if you add more items to the menu (100/6 = 16.66) */
}

    Cheers! 
    Josue

    June 17, 2014 at 11:37 pm #280267
    getHopeGlobal

    Wow, you are fast! That made the menu items shift to the left side and the search box to the right side, but I need the solid dark brown color to fill in the line in between (or have the menu items centered with the sold brown on either side to the edge of the screen.)

    June 17, 2014 at 11:41 pm #280270
    Josue

    Try adding this too:

    #header_main_alternate{
 background: #693126;
}

    Regards,
    Josue

    June 17, 2014 at 11:43 pm #280272
    getHopeGlobal

    That worked perfectly–thanks!

    June 17, 2014 at 11:44 pm #280273
    Josue

    You are welcome, always glad to help :)

    Regards,
    Josue

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Full Width Menu Bar’ is closed to new replies.