Hi, in the header main menu is any way to take more advantage of the menu space? for avoid menu jump of line… I removed the search icon but the menu is not using this right space đ
Also if is possible, somebody knows how make the menu font smaller if someone resize the window?
Thanks for the help.
Hi,
Can you provide a link to see the issue? I will provide you a solution for the responsives to, via CSS.
Thanks for the message!
Thanks a lot, is http://www.tarotamor.es đ
If you can see also i am having problems with the tagdiv author widget css buttons đ
I have eliminated the pass protection for you can see the problem, the site is still non public
You can access?
Hi,
I have checked your site and you have to many menu items there. You can try to use this custom css in Theme Panel > Custom Css and apply this only for tablets – http://screencast.com/t/8Eu3obo5
@media(min-width: 768px) and (max-width: 1018px) {
.sf-menu > li > a {
padding-right: 0px !important;
}
.sf-menu > .td-menu-item > a {
font-size: 20px !important;
}
.td-header-main-menu {
padding-right: 0px !important;
}
}Thanks!
I know, I can delete one of menu but the problem is the same, the space dont used well taking advantage of full menu header bar. Is any option for use all this space also in desktop? not only in tables?
Thanks.
Hi,
Try to remove and (max-width: 1018px) from the above code so it will be applied also on desktop.
Provide again access, if this doesn’t help, so I can take a look again – http://screencast.com/t/bL1jT1aixDB
Thanks!
Hi, I have the same problem. CSS does not work.
https://cloud.mail.ru/public/3BSdkeVvVVCW/newspaper_menu.png
http://47oporalo.ru/
Hi,
I have checked your site and you have to many menu items, also containing long words and you use a hedera style with centered menu. You can try this custom css in Theme Panel > Custom Css (I customize it for your header style 10): http://screencast.com/t/kmFCrF7YP
@media(min-width: 768px) {
.td-header-style-10 .sf-menu > li > a {
padding-left: 0px !important;
}
.td-header-style-10 .td-header-main-menu {
padding-left: 0px;
padding-right: 0px;
}
.td-header-main-menu {
padding-right: 0px !improtant;
}
.td-header-style-10 .sf-menu a.sf-with-ul {
padding-right: 20px;
}
.td-header-style-10 .sf-menu .td-icon-menu-down {
padding-left: 3px;
}
}
Hope this helps!
Work great in http://www.tarotamor.es, but i lost the word spacing, i tried with word-spacing in custom but separe the words instead the categories, I am really bad on css đ
Yes, it’s work! Thanks!
Hi,
@josito Please replace the above css code with this one to have space between menu items on desktop: http://screencast.com/t/MVJbZ97BluAy
@media (min-width: 1019px) {
.sf-menu > li > a {
padding-right: 20px !important;
}
}
@media(min-width: 768px) and (max-width: 1018px) {
.sf-menu > li > a {
padding-right: 0px !important;
}
.sf-menu > .td-menu-item > a {
font-size: 20px !important;
}
}
Also if you want to add word spacing you can add this code for desktop media query – http://screencast.com/t/otUeNd6p
.sf-menu > .td-menu-item > a {
word-spacing: 5px;
}
Hope this helps!
Hello, I want the tap part of my website menu look rather big, then I add the code in costum CSS:
.td-header-main-menu{
padding: 10px;
}
.td-header-sp-rec{
padding-top: 20px;
but it turns out if opened through the mobile device logonya cut off. How to solve it for logo + mobile-toggle + search button is back in the middle. But if opened through the desktop the menu part is still the same as I want above.
my website: https://www.rudiberbagi.com
this screenshot in the desktop: http://prntscr.com/iebqz8
and this screenshot in mobile device:http://prntscr.com/iebrjt
please help me, thank you.
Hi,
There is a simple solution for that. Enter the custom code in Theme panel->Advanced CSS for the sections (screen widths) you want it to apply.
If you want that code to work only on desktop and not affect mobiles, enter in in the desktop section
– https://www.screencast.com/t/aM3DTvxx5K
Thanks
