Was it fine in Firefox 60 -- new issue in Firefox Beta?

Even if Firefox for Android identifies itself as a desktop version of Firefox (Linux instead of Android), the other parameters sites use to adapt the display remain in place, especially screen/window dimensions. Perhaps there is a gap in the theme's style rules where bad things happen??

here are some screenshots of the broken theme.

the website is http://www.lulielens.com

here is a picture of how it appears using desktop mode in any other browser

Hmm. In your page, you have:

<style type="text/css">  @import "http://www.lulielens.com/wp-content/themes/mystiqueBACKUP/style.css";  @import "http://www.lulielens.com/?mystique=css"; </style>

The first style sheet sets that unusual background image:

#page{background:transparent url(images/header.jpg) no-repeat center top;}

Then the next one overrides it:

#page{background-image:url(http://www.lulielens.com/wp-content/uploads/2014/06/header-white.jpg);}

Something appears to be going wrong on FxA/RequestDesktop with either loading or applying the second style sheet, or the order in which they are applied.

As a test, could you add !important to the second rule to see whether it overrides the first one:

#page{background-image:url(http://www.lulielens.com/wp-content/uploads/2014/06/header-white.jpg) !important;}

If that makes no difference, Firefox may not be loading/applying the second style sheet.

This theme appears not to have had any updates for 6 years, so it could possibly use some assumptions that are no longer applicable. But I don't enjoy reading PHP so I must leave that question to others.

what you wrote works somewhat! I have uploaded a screenshot of what the page looks like now.

how do you suggest I proceed?

Thanks so much for helping!

I see the Logo is still not centered. So, I think Firefox might be applying the two style sheets in the wrong order.

As a temporary quick fix, what do you think about copy/pasting the 30 rules from the second style sheet (98 lines) to the end of the first one (979 lines)? It would be a little redundant to duplicate those rules, but should work around any issue with order of parsing.

Just to clarify, the second style sheet is the "mystique/style.css" ? The file i am looking at has 1577 lines. Trying to find the files to edit them like you instructed.

Thanks again!

These are the two I have in mind, but their location on the back end may vary:

• (long one) http://www.lulielens.com/wp-content/themes/mystiqueBACKUP/style.css
• (short one) http://www.lulielens.com/?mystique=css

I found it! and applied the changes and now it's almost perfect. The only thing missing is that the background is black with a grey gradient on it..

Thank you a million times!

I notice that dress has a few holes in it. But then, I don't know anything about fashion.

Perhaps there is a different place in the page where the style rules are applied in an unexpected order. This is very hard to diagnose on mobile, so I was using the Page Inspector in Firefox on desktop, and turning different style rules on and off for different areas of the page. You could give it a spin and see if you can discover which rule in which file is causing the black background.

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