Large width nav drop-down going off screen
-
-
- Dave
- Rocketeer
- Posts: 85
- Thanks: 2
- Print, Web & SEO
-
I'm enjoying working with Gantry far more than the stuff over at Yootheme. However one issue I noticed with Gantry that they have addressed in their themes is the nav menu drop-down not going off screen.
I have a full width nav and one of the menus is near the right side with a 2-column drop-down that extends to the right instead of detecting the edge and flipping left.
This image is hidden for guests.
Please log in or register to see it.
This also happens with each Rockettheme demo I looked at except no browser scrollbar appears - the drop-down links simply disappear off-screen. I simply reduced the browser window width until this happened, for anyone still not clear on what I'm having an issue with.
Would love to know how to fix this so the entire drop-down is still visible and without creating browser scrollbars.
Thanks. - Last Edit: 10 years 9 months ago by Dave.
-
-
-
- Dimitris Mitsis
- Elite Rocketeer
- Posts: 1562
- Thanks: 129
-
Hi,
We could really use a url of your site and the name of theme in order to help you and maybe provide specific styles or fixes for your site.
Dimitris
- Last Edit: 10 years 8 months ago by Dimitris Mitsis.
- Posting a url to your site and screenshots of your issue could be really helpful.
How to add a Custom Stylesheet in Gantry for WP
-
-
-
- Dave
- Rocketeer
- Posts: 85
- Thanks: 2
- Print, Web & SEO
-
The Website I used for the screen capture is not availabe so I created another one with a similar issue.
Using wpspectral as an example to simulate my issue because I already took down the original site, please resize your Web browser until it just reaches the border of the "Downtown" menu link.
Now hover over the "Styles" menu link to render the drop-down - the drop-down renders outside the browser window instead of 'flipping' back inside or to the left of, the site layout border.
Using the other theme provider's site, wpglass as an example, doing the same thing with your browser - the "Wordpress" drop-down flips left, into the site borders. This is what I'm trying to achieve.
Thanks. - Last Edit: 10 years 8 months ago by Dave.
-
-
-
- Dimitris Mitsis
- Elite Rocketeer
- Posts: 1562
- Thanks: 129
-
Hi,
The first link with Spectral seems to be pointing to a broken site. It seems like no stylesheet is loaded there. This happens sometimes when there is a low memory limit assigned for your server. Try increasing that in your php.ini file (i believe you're using a local server so this should be easy). Also, you might have to reinstall RocketLauncher after that.
Also, i've understood what the issue is but i can't see this working on the other provider's theme. I believe the same thing happens there as well. I've attached a screenshot with Firefox and the same thing is happening with Chrome too.
Regards,
Dimitris
- Posting a url to your site and screenshots of your issue could be really helpful.
How to add a Custom Stylesheet in Gantry for WP
-
-
-
- Dave
- Rocketeer
- Posts: 85
- Thanks: 2
- Print, Web & SEO
-
I doubled the php memory limit from 256 to 512mb - if this does not help I'll increase it again.
Attached are two screen captures showing in better detail what both sites look like at my end. We must have significantly different installs of both Firefox and Chrome because on both my computers each site nav renders the same.
Additionally the Spectral drop-down appears to render under the social icons. Probably a z-index adjustment but if you could expand on that also I would appreciate it.
I did notice while using Firebug the Glass nav drop-down has a DIV class of "dropdown columns1 flip" with the CSS as:
.menu-dropdown li:hover .dropdown.flip, .menu-dropdown li.remain .dropdown.flip { left: auto; right: 0; }
Does this help drill down to what I'm trying to achieve with the Rockettheme theme?
EDIT
Just found this and it explains exactly the issue I am having. Hopefully if your browser is stil rendering correctly this example will better show my issue than trying to see it via my local server.
Problem: jsfiddle.net/G7qfq/
And here is it fixed:
Fixed: jsfiddle.net/G7qfq/5/
And here is the Stack Overflow thread:
stackoverflow.com/questions/11512032/det...en-and-reposition-it
I'm not a javascript pro so hopefully you guys can help me implement this with the Rockettheme.
EDIT
I need to make note of something I just discovered - when I disable Style > Fixed Header for the Spectral theme, the sub-menu z-index issue appears, where it is under the social icons. When I enable fixed header the nav sub-menu appears above the social icons.
Please also read this topic I started for a similar issue with another theme.
Thanks. - Last Edit: 10 years 8 months ago by Dave.
-
-
-
- Dave
- Rocketeer
- Posts: 85
- Thanks: 2
- Print, Web & SEO
-
-
-
- Dave
- Rocketeer
- Posts: 85
- Thanks: 2
- Print, Web & SEO
-
Found something that I'm hoping will help this along since it's been over a week without a response.
I was looking through the older themes and came across Reaction , looks like 2010. The menu navigation for this theme reacts exactly as I would expect the newer theme's to - it detects the browser edge and flips left.
Any chance I can get help implementing this on a newer theme, such Gantry and/or Acacia? As I've mentioned the current coding does not take this into account and instead forces sub-menus off screen. - Last Edit: 10 years 8 months ago by Dave.
-
-
-
- Dave
- Rocketeer
- Posts: 85
- Thanks: 2
- Print, Web & SEO
-
Well it's been 2 weeks and a day since I started this thread and it appears Rockettheme staff interest has significantly waned. So I'm resigned to groveling or begging for help. Sadly I had to restructure my menu layout in a less than desirable manner so no submenu links appear at the far right position.
Here's my last ditch effort - could someone up the food chain at least look at the code snippets and links I posted and then point me at the file(s) I need to modify? From that point I'll mark this thread as solved and try to get help from someplace like Stack Overflow or bang it out on my own.
As much as I enjoy working with Gantry the menu functionality is a huge letdown.
-
-
-
- Reggie Simmons
- Preeminent Rocketeer
- Posts: 5200
- Thanks: 530
-
This is definitely something I'll bring up to the developers. We can most likely provide a personal fix for you on this website you are creating:
acacia.rocketpixels.com/
But it might be best to wait until you have "real" menu options set up. - Kind regards,
Reggie
Learn to code for free.
www.freecodecamp.org
-
Time to create page: 0.053 seconds