Hot on HuffPost Tech:

See More Stories
Engadget for the iPhone: download the app now
AOL Tech

Remove Firefox 4.0's big, ugly, unmovable orange button

Update: this no longer works with more recent builds of the Firefox 4 beta. Please see our new post on how to move or remove the button.

Yup, you're not alone: that orange button in the top left corner of Firefox 4.0 just won't move.

Fortunately, with the help of a Neowin forum thread and a little hacking, I am now the proud owner of a see-through Firefox button that's in-line with my tabs! If you'd also like to move that orange button -- or simply change its color! -- follow these easy steps:
  • Locate your Profile directory -- click Help > Troubleshooting Information and then Open Containing Folder
  • Now navigate to the Chrome directory
  • Copy userChrome-example.css
  • Rename your copy to userChrome.css
  • Open userChrome.css your editor of choice and dump the following code in it:
#appmenu-button-container {
position: fixed !important;
#appmenu-button {
padding: 3px 18px 3px 18px !important;
margin-top:3px !important;
background-color: rgba(54, 121, 166, 0.2) !important;
#navigator-toolbox[tabsontop="true"] #TabsToolbar {
padding-left: 95px !important;
#navigator-toolbox[tabsontop="true"] #TabsToolbar {
padding-left: 105px !important;
padding-top:1px !important;
padding-right:98px !important;
Alternatively, download my userChrome.css file and copy it into the directory. Don't forget to rename it.

The second block (#appmenu-button) is the most important. You could easily change the color (54, 121, 166) or the opacity (0.2) -- simply change the values, save, and restart Firefox 4.0.

With some knowledge of CSS you could also move the button around (padding and margin), but I'll investigate more tomorrow. In the mean time, enjoy your less intrusive Firefox 4.0 menu!

(Incidentally, if you missed the previous post, Firefox 4.0 beta 1 is now available for download!)

Tags: 4.0, appmenu, css, firefox, hack, menu, move, orange button, OrangeButton, stuck



Add your comments

Please keep your comments relevant to this blog entry. Email addresses are never displayed, but they are required to confirm your comments.

When you enter your name and email address, you'll be sent a link to confirm your comment, and a password. To leave another comment, just use that password.

To create a live link, simply type the URL (including http://) or email address and we will make it a live link for you. You can put up to 3 URLs in your comments. Line breaks and paragraphs are automatically converted — no need to use <p> or <br /> tags.