Tagged: menu, navigation, responsive
-
AuthorPosts
-
October 13, 2014 at 3:29 pm #334966
Hi guys
Just built a website using Enfold, and loving the easy way of use and design – thumbs up!However, a small issue has occured. On my clients’ website I’m experiencing that the navigation/menu doesn’t adjust when shown on e.g. a tablet or smartphone. When the responsiveness kicks in the menu is perfect, but the sizes between doesn’t look that good. Do you have a solution for this?
Thanks in advance :-)
Kind regards,
StineOctober 14, 2014 at 1:04 am #335300Hi socialadvice!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
@media only screen and (max-width: 1290px) { .av-main-nav > li > a { padding: 0 6px; }}
@media only screen and (max-width: 1140px) and (min-width: 990px) {
.logo img { max-height: 70%; }}Regards,
YigitOctober 20, 2014 at 2:23 pm #338327Hi Yigit
Thanks for your quick response, however this doesn’t seem to fix my issue. The menu/navigation still looks odd on e.g. an Iphone or an Ipad.Kind regards,
StineOctober 20, 2014 at 11:50 pm #338756Hi!
This is how it looks on my iPhone 4 – http://i.imgur.com/dJkLuEp.png
Can you post a screenshot and show the issue please?
and please add following code to Quick CSS to decrease font size of H1 element@media only screen and (max-width: 480px) { h1 { font-size: 28px; }}
Best regards,
YigitOctober 21, 2014 at 9:54 am #338925Hi Yigit
The CSS fixed the H1 issue on an Iphone and it shows perfectly on a smartphone, however it still doesn’t do the trick on an Ipad/tablet. Is there any way that I can change it so the responsive menu appears on an Ipad?
I’ve checked out a few other comments e.g.: https://kriesi.at/support/topic/menu-problem-on-ipad/ but this doesn’t do the trick either…Thanks a lot for your help, I really appreciate it, hopefully I will be able to get this to work.
Thanks
Kind regards
StineOctober 21, 2014 at 10:35 am #338937This reply has been marked as private.October 27, 2014 at 1:24 pm #341457Hi!
Sorry for the late reply. Can you please create a temporary admin login and post it here privately so we can look into it?
Regards,
YigitNovember 4, 2014 at 11:54 am #345817This reply has been marked as private.November 6, 2014 at 1:24 am #346901Hi!
I think best solution is to hide main menu and show the menu like on smartphones, because you have too many menu items:
@media only screen and (max-width: 1024px) and (min-width: 768px) { #advanced_menu_toggle, #advanced_menu_hide { display: block; } .main_menu { display: none; }}
Best regards,
Andy -
AuthorPosts
- You must be logged in to reply to this topic.