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!)