I have just started learning about responsive grids, menus and the like... I have, with the help of design shack, built a responsive menu and started to test it.
However, in Firefox full browser view and Chrome narrow view the last navigation drops down. But in Chrome full browser it is fine. In firefox it just gets worse.
I changed nav ul - to nav ul li and added padding 0 - that fixed the initial last child dropping when in full browser mode.
To correct the li's dropping in narrow mode - I had to tweak the @media for narrow, I had to adjust the li:nth-child(5)-(8) by adding the border in there.
However, in Firefox full browser view and Chrome narrow view the last navigation drops down. But in Chrome full browser it is fine. In firefox it just gets worse.
Click here to see the issue
Any thoughts as how to approach correcting this?
Thanks!
Tim
Or link to it through Drupal?
Thanks!
p.s. I am probably going to have to add some reset code for the navigation as well. Will let you know how it works out.
In trying to think it through I have one of the li elements not working right...ideas as too what would help, margin, line-height.
Would love ideas - I'll keep testing.
Thanks
if that doesnt work or make sense can you set up a jsfiddle or link to the page so i can dig into the code and see exactly whats going on?
I changed nav ul - to nav ul li and added padding 0 - that fixed the initial last child dropping when in full browser mode.
To correct the li's dropping in narrow mode - I had to tweak the @media for narrow, I had to adjust the li:nth-child(5)-(8) by adding the border in there.
That did it. Good luck to ya'll
Thanks!
just for future reference mr coyier's post on how to use jsfiddle is here: http://css-tricks.com/seriously-just-make-a-jsfiddle/