Nav Menu within stack
Permalink
Hi
I have some sidebar navigations in various sites - some inserted as a stack, others are created once and copied via clipboard to same place in other pages, All the links work fine in Desktops and in Ipad, all (as far as I can see) in a range of common Browsers. However I have discovered that in the cases of the ones where a stack is used, the links in the menu items do NOT work in mobile devices (limited selection tested so far). The menu items themselves show OK, they just don't allow user to go anywhere.
Question: is there anything inherent in stacks or in how I am using them that might cause this?
Many thanks
Robert
I have some sidebar navigations in various sites - some inserted as a stack, others are created once and copied via clipboard to same place in other pages, All the links work fine in Desktops and in Ipad, all (as far as I can see) in a range of common Browsers. However I have discovered that in the cases of the ones where a stack is used, the links in the menu items do NOT work in mobile devices (limited selection tested so far). The menu items themselves show OK, they just don't allow user to go anywhere.
Question: is there anything inherent in stacks or in how I am using them that might cause this?
Many thanks
Robert
Hi Mr K
Sorry for delay in being able to get back to you. I am currently working on it but at the time of writing I am getting the problem on all pages apart from 2 on the following site:
greenflameinstallations.co.uk
greenflameinstallations.co.uk/index.php/test-menu works. I have no idea why. I just inserted an auto nav block for the purposes of solving this problem. I have done the same on other pages and they still dont work on mob. The only page where the nav menu works on a mobile screen on live site is the Customer Installation Gallery link. Again, I have no idea why this should be the case. I can find no difference in any other variable.
Thoughts gratefully accepted. Thanks.
R
Sorry for delay in being able to get back to you. I am currently working on it but at the time of writing I am getting the problem on all pages apart from 2 on the following site:
greenflameinstallations.co.uk
greenflameinstallations.co.uk/index.php/test-menu works. I have no idea why. I just inserted an auto nav block for the purposes of solving this problem. I have done the same on other pages and they still dont work on mob. The only page where the nav menu works on a mobile screen on live site is the Customer Installation Gallery link. Again, I have no idea why this should be the case. I can find no difference in any other variable.
Thoughts gratefully accepted. Thanks.
R
Update: I have since discovered that if I take away the other blocks in the main part of the page (eg columns 2 and 3 on a 3 column setup) the nav menu works. Even more confusing.
R
R
Try changing this rule.
- comment out the float
- add display:block;
#c5wrap ul#sidebarnav li a { /* float: left; */ display: block; width: 100%; margin-bottom: 4px; padding: 4px 0px 4px 4px; /* customize_sidebar_nav_text */ color:#ffffff; /* customize_sidebar_nav_text */ /* customize_sidebar_nav_background */ background-color:#008202; /* customize_sidebar_nav_background */ /* customize_sidebar_nav_text */ font:normal normal 14px Verdana; /* customize_sidebar_nav_text */ }
- comment out the float
- add display:block;
Hi
Well can I thank you very much for your time and effort. That is very much appreciated.
I made those small changes and - certainly on an Android device the links are now working. If you have the time, can you pen a short paragraph on why those 2 changes should positively affect the ability for the hyperlink to work on a mobile device?
R
Well can I thank you very much for your time and effort. That is very much appreciated.
I made those small changes and - certainly on an Android device the links are now working. If you have the time, can you pen a short paragraph on why those 2 changes should positively affect the ability for the hyperlink to work on a mobile device?
R
I think the float was causing the middle column to layer over the links.
Setting display: block; makes the links block level elements that fill their container width.
Setting display: block; makes the links block level elements that fill their container width.
Thanks for that. Much appreciated!
Do you have a link to a website where you are having this problem?