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
