-
Posts
-
Hi,
How to remove the small arrows in the mega menu? I tried to add the code bellow (as seen in another related topic) but unfortunately it doesn’t work…
#top .main_menu .avia_mega ul ul li, #top .main_menu .avia_mega > li > ul li {
background-image: none;
display: none;
}Thank you,
ArielMy website is http://www.sos-paris-serrurier.fr and the submenu in question is ‘zone d’intervention’
The bullet are gone :) … but is there a way to ‘use the blank space’ where the bullet was? Because now the text is not aligned to the title.
Hi!
Please add following code to Quick CSS
#top #header .avia_mega_div > .sub-menu > li > ul > li a { padding: 0; }Cheers!
YigitIt didn’t work… (I also tried to add it directly in the custom.css file and with the ‘!important’ tag but still no luck :( )
Hey!
Please make sure that > sign is not converted to – http://i.imgur.com/IDXRZQ3.png in Quick CSS field
Regards,
YigitHi Yigit !
I used your code ( .avia-bullet { display: none !important; } ) to remove arrows and it works.
But the other one ( #top #header .avia_mega_div > .sub-menu > li > ul > li a { padding: 0; } ) doesn’t…
In fact, it correctly works when the menu titles are only text, but on my website, I put fontello icons in the menu titles ( using codes like : [av_font_icon icon='ue801' font='cinema' custom_class='bouton-dcp'][/av_font_icon] DCP ), so with your code it makes my menu appearing like “stairs”, but not aligned.
Is there a solution to ‘use the blank space’ where the bullet was? like wanted to do arielkas in this post ?One last question : is there a way to replace small arrows in the menu by fontello icons ( like I did my way ), but one icon per title in the menu ? ( Maybe using custom class in the menu titles or something like that… )
Thanks !
Hi!
You too please make sure that > sign is not converted to – http://i.imgur.com/IDXRZQ3.png in Quick CSS field. If that does not help, please create a temporary admin login and post it here privately.
Regards,
YigitHi!
Please check private message.
To create new user for us please use (Email address hidden if logged out) or one of your own email address as we only need to be able to login to check the issue.
Best regards,
Vinay KashyapHey!
it seems that you could achieve what you want, as I can see that you are using icons inside your mega menu:
If that’s not what you want, then please show us exactly what you need. Use a mockup/screenshots to make things clear for us (imgur.com, dropbox).
Cheers!
AndyHello Andy !
Yes I tried to do it by myself but first, my icons are not aligned with menu titles and that is what I would like to do. This is the reason why I’ve tried the code given by Yigit (#top #header .avia_mega_div > .sub-menu > li > ul > li a { padding: 0; }) but it doesn’t work.
And secondly, when I insert icons this way, texts next to them are not aligned together, so I added some code to adjust the padding but they are not exactly aligned on some screen (in fact it depends of the size of the screen) and anyway I think this is not the good solution.
So I would like to know if there is a better solution to insert different icons (one by button) to replace the small arrows by default in your theme.Thanks !
Hi!
but the icon seems to be aligned perfectly, as shown in my screenshot. What else do you need? a mockup showing the result would help a lot.
Cheers!
AndyHi Andy !
First, I would like to align all the icons with menu titles, like you can see on the picture attached (Imgur). I would like to align icons on the red line, exactly like small arrows are aligned in Enfold default theme.
Secondly, to make my menu appear like this, I used code for each button in the WordPress menu (example : [av_font_icon icon='ue891' font='entypo-fontello' custom_class='title1-button'][/av_font_icon] Title 1) and I applied a different custom class for each button, to try to align them together (example : .title1-button .av-icon-char {padding-right: 1px; padding-left: 1px;}).
I think my method is very complicated and the result is not so good (indeed the icons are not really aligned and it depends of screen size or browser…)So, my main question is to know if there is a better and easier way to replace small arrows of the Enfold default theme by custom icons, one for each title like I did on my website.
Thanks !
Hey!
if you want them to move more to the left side then use this code:
span.av_font_icon.avia_animate_when_visible.av-icon-style-.bouton-pad.av-no-color.avia-icon-pos-left.avia_start_animation.avia_start_delayed_animation { position: relative; left: -11px; }and adjust as needed.
But to be honest your icons look totally good to me and I can’t see any issue. A mockup showing the results you want to achieve would help a lot.
Cheers!
AndyHi,
Please use this css code instead.
#top #header .avia_mega_div > .sub-menu > li > ul > li a { padding: 3px 12px 3px 0; }Let us know if it helps. If it’s not working, please create a new thread and put the login credentials in the private field.
Best regards,
Ismael
- You must be logged in to reply to this topic.