Is it possible to have the Responsive2 navbar be full browser width?

Essentially what I want is the same full width navbar as seen in Ecolife.

Thanks for your help!

Hi

You would need to add either a background colour or image to the

#navwrap {
background:
}

Adding it to your custom.css

ah actually you would need also

#navwrap {
background:red;
float: left;
width: 100%;
}

Cheers
Paul

Hi Paul,

Thank you so much! I added your suggested CSS, and then I added a CSS class for the sticky nav, and then I added two media queries for some final tweaks. In case anyone else comes across this thread looking for the same type of styling, here is everything I ended up adding in custom.css:

/* make navbar full width */
#navwrap {
background:#5b91ac;
float: left;
width: 100%;
}

/* make sticky nav full width */
#navwrap.fixed {
background:#5b91ac;
}

/* after adding the above 2 classes, at smaller browser widths there was a strip of the navbar color displaying below the logo. I'm not sure if that was due to other custom css or from the existing template styles, but this removes that strip */
@media screen and (max-width: 1000px) {
#navwrap.area-wrap {
background-color: #fff;
}
}

/* This is a personal preference tweak to remove 20px of left/right padding that was displaying on the navbar at phone widths */
@media (max-width: 768px) {
body {
padding-left: 0px;
padding-right: 0px;
}
}

Cool thanks for taking the time to post a better more comprehensive solution

Cheers
Paul