Center footer menu mobile (Pro)

Support
#1

Having trouble trying to get the footer menu to be centred on mobile. Its close but not right.

http://wrnch.carteblanche.media/

#2

If I make the self align to center it centres it properly, but then its messed up looking on desktop and needs to be self align: start.

#3

Hi There,

Thanks for writing in!

as I don’t have access to your admin, can’t check the setting you have done. I can see you have added few custom CSS for the footer menu. You can remove this or can use this CSS to overwrite.

.e207-4.x-bar-container ul {
width: 100% !important;
}
@media (max-width: 768px) {
 .e207-4.x-bar-container ul li {
width: 100% !important;
max-width: 100% !important;
}
 .e207-4.x-bar-container ul li a {
width: 100% !important;
max-width: 100% !important;
text-align: center;
}
}

Hope this helps!

Thanks

#4

close but still not quite right

Ive added the login and pass above.

#5

Hi There,

Thanks for writing in!

@media (max-width: 768px) {
.ul.e207-6 {
 width: 100% !important;
}
ul.e207-6 li {
width: 100% !important;
max-width: 100% !important;
}
ul.e207-6 li a, .e207-6.x-menu > li > .x-anchor {
width: 100% !important;
max-width: 100% !important;
text-align: center;
}
}

Please replace the media query CSS with this.

Hope this helps!

#6

No dice yet

#7

Hi There,

Please also add this custom CSS:

footer.x-colophon .x-menu.x-menu-inline {
    width: 100%;
}

Hope it helps :slight_smile:

#8

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.