Hi, I have a problem making the main menu transparent, and I cannot figure out how to solve it.
This is my situation right now:
I would like everything (apart for the text) to be transparent.
If possible, also, I’d like to center the menu items at the middle of the menu.
Thanks!
Hi,
You can use this custom css to make the menu transparent:
.td-boxed-layout .td-menu-background .td-menu-wrap {
background-color: transparent !important;
}You can change the menu items text color from theme panel > custom typography: http://screencast.com/t/TebRJoQz
Use this css to center the menu:
#td-top-menu .sf-menu {
display: table;
float: none;
margin-left: auto;
margin-right: auto;
}Result: http://screencast.com/t/cJsfNWvCE
Thanks
Thanks Lucian,
the code works perfectly. I was wondering what class do I have to edit to change the style of the bar under the menu:
I’d like to make it half transparent, or even remove it if that’s possible.
Thanks!
Hi,
Use this custom css:
.td-boxed-layout .td-menu-background .td-menu-wrap {
background-color: transparent !important;
border-bottom: 4px solid transparent;
}
.td-full-layout .td-menu-background, .td-boxed-layout .td-menu-wrap {
background: none !important;
border-bottom: 4px solid transparent;
}
.td-full-layout .td-menu-background:after, .td-boxed-layout .td-menu-wrap:after {
display: none !important;
}Should work like this: http://screencast.com/t/mLA81y0F
Thanks
Hi Lucian, these measures seem not to work on the 4.4 updated version of the theme. The menu is back to how it loocked before. How can I fix this?
Hi,
The update shouldn’t affect the custom css added in theme panel. Please make sure you still have this css in custom css field. I have tested this and worked fine using the 4.4 theme version.
Please let me know if you can’t fix this and also provide your site’s URL, I need to inspect this so I can provide a fix.
Thanks
I think there was a problem with the cache, or something similar. Now the problem is fixed, but I can’t manage to get rid of the white bar that you can see in the image here
How can i do this?
Hi,
Please try this css:
.td-boxed-layout .td-menu-background .td-menu-wrap {
border-bottom: none !important;
}Or provide your site’s URL, I need to inspect this so I can provide a fix.
Thanks
