We're calling on all EU-based Mozillians with iOS or iPadOS devices to help us monitor Apple’s new browser choice screens. Join the effort to hold Big Tech to account!

Pesquisar no apoio

Evite burlas no apoio. Nunca iremos solicitar que telefone ou envie uma mensagem de texto para um número de telefone ou que partilhe informações pessoais. Por favor, reporte atividades suspeitas utilizando a opção "Reportar abuso".

Saber mais

Need help with my userChrome.css and window controls

  • 4 respostas
  • 1 tem este problema
  • 14 visualizações
  • Última resposta por 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?
Capturas de ecrã anexadas

Modificado por cor-el a

Todas as respostas (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


Modificado por cor-el a

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.