Mobile menu width

Can you show me how to make the Mobile Menu full width 100% the screen.

Hi

Try this css in theme panel > custom code > custom css: http://screencast.com/t/dkN1ivSk

@media(max-width: 768px){.td-mobile-nav-wrap{
width: 100%
}
.td-menu-mob-open-menu .td-content-wrap {
left: 100%;
}
}

Thanks!

Thank you for your response.

But if I add a border-bottom for the header
.td-header-style-9 {
border-bottom: 3px solid #D60D0D;}
On the mobile site, this border will lose about 20% width from the leftside (it only appear 80% width from the right side). The desktop version still appears 100% width.

Do you have any other solution?

• This reply was modified 10 years by trigrafik.

Hi

Replace all css with this one, now the border should be displayed fine:

@media(max-width: 768px){
.td-menu-mob-open-menu .td-mobile-nav-wrap{
width: 100%
}
.td-menu-mob-open-menu .td-content-wrap {
left: 100%;
}
.td-header-style-9 {
border-bottom: 3px solid #D60D0D;}
}
}

Thanks!