html - Navigation displaying slightly different in Firefox -
on site i'm working on, i've got looking pretty same on main browsers (checking chrome, safari & firefox).
all except pesky 1px gap on navigation items, noticeable on active items (when background filled).
you can visit site here: http://lumbre.breadadams.com/
this gap i'm talking about

i've messed height, line-height, padding, etc. of multiple elements (nav, ul , such), nothing seems trick.
however if increase font-size 1.2em 1.3em fits, doesn't on chrome. increasing font 0.1 @ time makes alternate between fitting on chrome , firefox basically.
#navigation-container #main-nav ul > li.menu-item-has-children > a::after { content: ""; font-family: fontawesome; margin-left: 4px; position: absolute; } here answer amigo!
just add position: absolute;
it's :after (the small icon) needs position absolute. it's causing bit of upper space, when give position absolute, friend!
Comments
Post a Comment