-
AuthorPosts
-
April 15, 2015 at 10:16 am #428773
Hello,
I would like to customize the main menu .
There have already made adjustments. Now I would like that adapts to the main menu of the browser width. This means that the colored bar at zoom in / zoom scale of the browser. But the colored bars should always have the same width and height.
Currently the colored bars are right aligned as in the attached picture .
I also have a picture taken , such as the navigation should be.
I hope you can help me and thank you ever :- )
April 15, 2015 at 9:21 pm #429234Hey LorbeerDesign!
You might be able to do it like so.
nav.main_menu a { width: 6vw !important; }
Send us a link to your page and we’ll see what we can do.
Best regards,
Elliott- This reply was modified 9 years, 8 months ago by Elliott.
April 16, 2015 at 7:56 am #429379April 17, 2015 at 4:31 am #430071Hey!
Could you provide us with a link to the site in question so that we can take a closer look please? I can’t see a link your previous reply.
Regards,
RikardApril 17, 2015 at 7:47 am #430134April 17, 2015 at 8:45 pm #430599Hi!
Try this out instead.
.av-main-nav { width: 100% !important; } .av-main-nav > li { width: 20% !important; } .avia-menu-text { display: block !important; width: 100% !important; }
Best regards,
ElliottApril 20, 2015 at 8:19 am #431146Hi Elliott,
Thanks for your answer. I have used the code. Unfortunately, it does not come out the desired result. Below is a screenshot of what causes the code.
Perhaps you’ve still got a great idea :)Best Regards
Lorbeer DesignApril 20, 2015 at 9:50 pm #431624Hey!
I think that should be working. Send us a WordPress login and we’ll take a closer look.
Regards,
ElliottApril 21, 2015 at 8:11 am #431796This reply has been marked as private.April 22, 2015 at 1:17 pm #432738Hi!
you did not implement Elliott’s code into your Quick CSS. Now I did it for you and add some more values to it so it fits your mockup:
.av-main-nav { width: 100% !important; } .av-main-nav > li { width: 20% !important; } .avia-menu-text { display: block !important; width: 100% !important; padding-top: 0 !important; padding-bottom: 0 !important; line-height: 25px; }
Please adjust by yourself as needed. You find this code on the very top of your Quick CSS.
There is one line of code in your Quick CSS:
.main_menu > div {height: 40px !important;}
which you would need to change to something like
.main_menu > div {height: 33px !important;}
if you want the menu to get closer to main content.
For further theme customization we kindly ask you to hire a freelancer.
Best regards,
AndyApril 23, 2015 at 9:52 am #433321Hi Andi,
that’s wonderful, it works perfectly. I am impressed of the great support!I am very grateful.
Best Regards -
AuthorPosts
- The topic ‘customize main menu’ is closed to new replies.