How do I get rid of a white border around buttons when using Firefox themes?
I recently moved to a much higher resolution screen: 1380x768 -> 1920x1080. With a higher resolution, I find that the white border around buttons/icons when hovered-over is notably more distracting. Image: http://i.imgur.com/tdd7ucy.jpg
This border only appears on certain buttons in the Firefox UI. So far I've noticed that it only appears on navigation buttons (refresh, forward/back, etc.) and addon buttons in the navigation bar added via the customization window, in all cases **except** using large icons with no text. In that single case, the buttons have the sleek animated highlighting that the default Firefox skin has. Otherwise, the white border is the hover action. The border also appears around all of the buttons I have in both the bookmarks toolbar as well as the addons toolbar.
I've tried this in a brand new profile with no addons, so I'm confident that it isn't because of an addon that I have. You could probably reproduce this too: 1. Open a new profile 2. Hover over various buttons, also check with both large/small icons 3. Go to the personas site and get any persona 4. Hover over various buttons
Ideally I'd like all of my buttons to have the same sleek white highlight that the navigation bar icons have when they're set to large, OR a softer color/glow that large icons that the default skin has.
Does anyone have a way to do this?
All Replies (2)
This will reset the position of all your toolbar icons, but might resolve the white border issue:
Press Alt+V, then go to View -> Toolbars -> Customize. In the "Customize Toolbar" window, click "Restore Default Set". It will move the Stop/Reload buttons back into the URL bar, make the Back button larger, etc. but does that fix the button borders?
If you View -> Toolbars -> Customize again, you should be able to move the buttons back / re-add any buttons which were removed by the restore.
I don't get the white button borders here, but I notice when I've changed the toolbar to "Show: Icons and Text" instead of just "Icons," when I hover-over the back/forward/etc. buttons a blue box shows around them; maybe that's a system setting, which color it is... When I "Restore Default Set," it goes back to "normal" (though persona is still enabled).
Here's a before and after pic with the "Designer Red" persona, hovering over the Reload button in both cases:
http://i.imgur.com/Ooe1C9M.png
Just to re-state the whole process here:
- I re-produced the border (in my case, as said, Blue not White) by Customizing toolbar to "Show: Icons and Text", closing customize window, borders appear on-hover.
- Then switching back to just Show: Icons, borders still appear on-hover.
- Then I did the Restore Default Set, moved icons back the way shown, and borders are gone / more "normal Firefox looking."
Does that fix your issue as well? If not, which persona did you use in your screenshot?
I just noticed that after I "Restore Default Set" I didn't re-check the "Use Small Icons" box! Is yours checked? Do the borders go away if you uncheck it? They come back for me when that box is checked.