Skip to main content

Here is a guide that will give you the custom css to make the logo and menu within Flexform. All you need to do is add the below to Flexform Options > General Options > Custom CSS:

/* Full width logo code */
#header-section #logo {
width: 100%;
}
#header-section #logo img, #header-section #logo img.retina {
margin: 0 auto;
}

/* Full width menu code */
#nav-section {
width: 100%!important;
}
.nav-wrap {
float: none!important;
}
#main-navigation {
float: none;
width: 100%;
height: 48px;
text-align: center;
}
nav .menu li {
float: none;
}

/* Disable the nav search */
#nav-search {
display: none;
}

/* Responsive code */
@media only screen and (max-width: 767px) {
#header-section #logo img, #header-section #logo img.retina {
margin-bottom: 20px;
}
#main-navigation {
width: auto;
height: auto;
text-align: left;
}
}

– Ed

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.