Join the Mozilla’s Test Days event from Dec 2–8 to test the new Firefox address bar on Firefox Beta 134 and get a chance to win Mozilla swag vouchers! 🎁

Zoeken in Support

Vermijd ondersteuningsscams. We zullen u nooit vragen een telefoonnummer te bellen, er een sms naar te sturen of persoonlijke gegevens te delen. Meld verdachte activiteit met de optie ‘Misbruik melden’.

Meer info

Deze conversatie is gearchiveerd. Stel een nieuwe vraag als u hulp nodig hebt.

Why firefox doesnot shows my background image?

more options

I have a website which is working fine in chrome , edge and other browser but when I went with Firefox than the background of website disappear . If I inspect to CSS and just click here and there in CSS it started appearing but if I reload the page without cookies than again it disappear . here is my CSS

.top {

   background-image: url("../img/img.png");
   background-position: center center;
   background-repeat: no-repeat;
   background-size: cover;
   background-attachment: fixed;
   height: 100%;

} URL is fine i already tested it . can anyone help me with this? I already tried

display: block;

I have a website which is working fine in chrome , edge and other browser but when I went with Firefox than the background of website disappear . If I inspect to CSS and just click here and there in CSS it started appearing but if I reload the page without cookies than again it disappear . here is my CSS .top { background-image: url("../img/img.png"); background-position: center center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; height: 100%; } URL is fine i already tested it . can anyone help me with this? I already tried display: block;

Alle antwoorden (3)

more options

I notice you used height: 100%. Firefox requires that the height of the containing element also be defined when using height: 100%. If the containing element, or any containing element beyond that, has a height of auto, then the height of the image may be undefined and limited to the height of the content. To see whether this could be an issue for your page, open the Page Inspector and check the Layout information for .top (it's among the panels on the right side of the inspector for the selected element).

https://developer.mozilla.org/docs/Tools/Page_Inspector

more options

I had checked but the containing element doesnot have height: auto ; +

more options

Okay.

(Hard to guess the problem without seeing the page. If pasting a URL, break the link before .com or other top level domain to avoid delays caused by link moderation.)