Pesquisar no site de suporte

Evite golpes de suporte. Nunca pedimos que você ligue ou envie uma mensagem de texto para um número de telefone, ou compartilhe informações pessoais. Denuncie atividades suspeitas usando a opção “Denunciar abuso”.

Saiba mais

Esta discussão foi arquivada. Faça uma nova pergunta se precisa de ajuda.

Is there a way to left-align all images upon opening and remove the dark gray background. Thanks

  • 3 respostas
  • 1 tem este problema
  • 4 visualizações
  • Última resposta de dlove123

more options

I would like my photos to open like the old default style. Firefox quantum doesn't have an add-on that will remove the dark color and left-align the image like before.

Thanks for any feedback.

I would like my photos to open like the old default style. Firefox quantum doesn't have an add-on that will remove the dark color and left-align the image like before. Thanks for any feedback.

Solução escolhida

You can do it with a custom style rule and the Stylus extension, or a userContent.css file. If you already have Stylus installed, that would be easier.

One preparatory setting change:

(1) In a new tab, type or paste about:config in the address bar and press Enter/Return. Click the button promising to be careful or accepting the risk.

(2) In the search box above the list, type or paste moz-d and pause while the list is filtered

(3) Double-click the layout.css.moz-document.content.enabled preference to switch the value from false to true

The Stylus extension:

This is one of the easiest ways to inject custom style rules into web pages:

https://addons.mozilla.org/firefox/addon/styl-us/

If you don't want to install it, an alternative is to create a userContent.css file with the same rule. (See: http://kb.mozillazine.org/UserContent.css)

One-time Setup in Stylus:

Open the "Manage" page, which lists your existing user styles, if any.

Click the "Write new style" button.

In the "Enter a name" space, you can put something like Stand-alone images since this rule will only affect those.

On the right side, click in the box below "Code 1" and paste the following:

@-moz-document media-document(image) {
    body {
        color: #000 !important;
        background-color: #f8f8f8 !important;
        background-image: none !important;
        height: 100vh !important;
    }
    body > img {
        position: static !important;
        margin: 8px 0 0 8px !important;
    }
}

This gives you a very light gray background and positions the image in the upper left corner with 8 pixel margins at the top and left (similar to a normal web page). You can edit those 8px values as you like.

Then click the Save button in the left column and try viewing a stand-alone image in a different tab.

Success?

Before and After screenshots attached for reference.

Ler esta resposta 👍 1

Todas as respostas (3)

more options

So what site is hosting your images at? I would say the format would be from their site not the Browser as it only display what it is given.

more options

Solução escolhida

You can do it with a custom style rule and the Stylus extension, or a userContent.css file. If you already have Stylus installed, that would be easier.

One preparatory setting change:

(1) In a new tab, type or paste about:config in the address bar and press Enter/Return. Click the button promising to be careful or accepting the risk.

(2) In the search box above the list, type or paste moz-d and pause while the list is filtered

(3) Double-click the layout.css.moz-document.content.enabled preference to switch the value from false to true

The Stylus extension:

This is one of the easiest ways to inject custom style rules into web pages:

https://addons.mozilla.org/firefox/addon/styl-us/

If you don't want to install it, an alternative is to create a userContent.css file with the same rule. (See: http://kb.mozillazine.org/UserContent.css)

One-time Setup in Stylus:

Open the "Manage" page, which lists your existing user styles, if any.

Click the "Write new style" button.

In the "Enter a name" space, you can put something like Stand-alone images since this rule will only affect those.

On the right side, click in the box below "Code 1" and paste the following:

@-moz-document media-document(image) {
    body {
        color: #000 !important;
        background-color: #f8f8f8 !important;
        background-image: none !important;
        height: 100vh !important;
    }
    body > img {
        position: static !important;
        margin: 8px 0 0 8px !important;
    }
}

This gives you a very light gray background and positions the image in the upper left corner with 8 pixel margins at the top and left (similar to a normal web page). You can edit those 8px values as you like.

Then click the Save button in the left column and try viewing a stand-alone image in a different tab.

Success?

Before and After screenshots attached for reference.

more options

Thank you for your quick repsonse, jscher2000. This was the perfect solution.