Dropdown Menu Spacing (Padding) Issues in v 86
I have an issue when viewing my site in Firefox. I have built custom dropdown menus in HTML and only in firefox does the space between items in the dropdown appear double what it does in other browsers. I have seen were others have said this is a padding issue only with Firefox but no way to "fix" it. Looking for some solutions.
Alle svar (7)
There are many ways to build a drop-down menu, so it's hard to guess whether this is due to margins, padding, line-heights, or some other factor.
Note: If you decide to share the URL of the site (or another site that demonstrates the same problem), you can break the URL (for example, put a space before the .com) so that it isn't detected as a live link. You can use the Preview Reply button to confirm. Otherwise, URLs of non-Mozilla sites trigger the spam link moderation feature and will delay the appearance of your post.
I can't share the internal site but you can access the code via the following link.
Your post will appear eventually!
Meanwhile, if you use each browser's Inspector, are they all following this height rule or are you getting different heights between them:
.dropdown a{
font-weight: 300;
color: #009BFF;
height: 40px;
}
They are all following the listed height rule. The spacing between them all is too much but is all the same.
I actually can't see any height difference at all with the code from Dropbox (this is on Windows, in case that matters):
Can you rule out add-ons as a possible factor? For example:
Testing in Firefox's Safe Mode: In its Safe Mode, Firefox temporarily deactivates extensions, hardware acceleration, optional userChrome.css/userContent.css files, and some other advanced features to help you assess whether these are causing the problem.
If Firefox is running: You can restart Firefox in Safe Mode using either:
- "3-bar" menu button > "?" Help > Restart with Add-ons Disabled
- (menu bar) Help menu > Restart with Add-ons Disabled
and OK the restart. A small dialog should appear. Click "Start in Safe Mode" (not Refresh).
If Firefox is not running: Hold down the option/alt key when starting Firefox. (On Windows, hold down the Shift key instead of the option/alt key.) A small dialog should appear. Click "Start in Safe Mode" (not Refresh).
Any improvement?
Safe mode made no difference.
Using the Inspectors' Layout panes in the respective browsers, can you see where the additional spacing is coming from? Since I don't see it, you'll need to be our eyes on this.