Hot on HuffPost Tech:

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

Hide or move the orange button in Firefox 4 (updated)

With the release of the latest Firefox 4 beta build, the original userChrome.css hack fails to remove the big, orange menu button. Fortunately, Download Squad commenter poiru pointed out a thread on the Rainmeter forums that provides some working CSS! If you know what you're doing, head over to that thread and copy the CSS -- if not, read on for some instructions!
  • Open Firefox 4 beta 5 (or later)
  • 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 in your editor of choice and dump the following code in it:
margin-top:0px!important;
}
#appmenu-button-container {
position: fixed!important;
}
#navigator-toolbox[tabsontop="true"] #TabsToolbar {
padding-left: 110px !important;
}
.tabbrowser-strip {
height: 22px!important;
}
.tabbrowser-tab {
height: 22px!important; padding-right: 3px!important;
}
#toolbar-menubar {
margin: -27px 98px 2px 95px;
}
Alternatively, you can download my userChrome.css file -- but make sure you rename it beforehand!

You'll note that my code is slightly different from the CSS on the Rainmeter forums. I played with the positioning a little to make it "tighter." That said, I'm sure that with a little work you could make it look even nicer -- and if you do, please share your changes in the comments.

Tags: css, ff4, firefox, firefox 4, firefox 4 beta 5, firefox beta, Firefox4, Firefox4Beta5, FirefoxBeta, hack, orange button, OrangeButton, userchrome

Comments

20