Join the AMA (Ask Me Anything) with the Firefox leadership team to celebrate Firefox 20th anniversary and discuss Firefox’s future on Mozilla Connect. Mark your calendar on Thursday, November 14, 18:00 - 20:00 UTC!

搜尋 Mozilla 技術支援網站

防止技術支援詐騙。我們絕對不會要求您撥打電話或發送簡訊,或是提供個人資訊。請用「回報濫用」功能回報可疑的行為。

了解更多

Need help with my userChrome.css and window controls

  • 4 回覆
  • 1 有這個問題
  • 14 次檢視
  • 最近回覆由 cor-el

more options

I'm trying to get Firefox to obey my window control order. For me, the window controls are on the left with the order of Close, Maximize, Minimize. But Firefox does not like that and puts it like macOS with Close, Minimize, Maximize.

So I got this going

#TabsToolbar {
  direction: ltr;
}

#tabbrowser-tabs {
  direction: ltr;
}

.titlebar-buttonbox {
  display: flex;
}

.titlebar-min {
  order: 2;
}

.titlebar-max {
  order: 1;
}

And it works well. But here is the problem, when the window becomes Maximized, the order changes to Maximize, Close, Minimize, as seen here in the photo. Anyone got some advice?

I'm trying to get Firefox to obey my window control order. For me, the window controls are on the left with the order of Close, Maximize, Minimize. But Firefox does not like that and puts it like macOS with Close, Minimize, Maximize. So I got this going <pre><nowiki>#TabsToolbar { direction: ltr; } #tabbrowser-tabs { direction: ltr; } .titlebar-buttonbox { display: flex; } .titlebar-min { order: 2; } .titlebar-max { order: 1; } </nowiki></pre><br> And it works well. But here is the problem, when the window becomes Maximized, the order changes to Maximize, Close, Minimize, as seen here in the photo. Anyone got some advice?
附加的畫面擷圖

由 cor-el 於 修改

所有回覆 (4)

more options

I am unable to edit my comment, but I didn't paste the proper userChrome.css file

This is the code I am actually playing with:

  1. tabbrowser-tabs {
 direction: ltr;

}

.titlebar-buttonbox {

 display: flex;

}

.titlebar-min {

 order: 3;

}

.titlebar-max {

 order: 2;

} .titlebar-close {

 order: 1;

}

more options

In full screen mode you do not use .titlebar-buttonbox (.titlebar-buttonbox-container), but you use #window-controls.

#TabsToolbar[inFullscreen] #window-controls


由 cor-el 於 修改

more options

cor-el said

In full screen mode you do not use .titlebar-buttonbox (.titlebar-buttonbox-container), but you use #window-controls.
#TabsToolbar[inFullscreen] #window-controls


Thank you. I tried this code but the same result happened:

  1. tabbrowser-tabs {
 direction: ltr;

}

.titlebar-buttonbox {

 display: flex;

}

.titlebar-min {

 order: 3;

}

.titlebar-max {

 order: 2;

} .titlebar-close {

 order: 1;

}

  1. TabsToolbar[inFullscreen] #window-controls {
 direction: ltr;

}

.titlebar-buttonbox {

 display: flex;

}

.titlebar-min {

 order: 3;

}

.titlebar-max {

 order: 2;

} .titlebar-close {

 order: 1;

}

more options

You need different selectors for the individual window-controls as you can see if you use the Browser Toolbox to inspect the controls.