Website looks different in Firefox

My website (www.pdallosart.com) is perfect in Safari, Chrome and Edge (viewed on laptop). Looks jumbled in Firefox – fonts are all mixed up and entries overlap. Any ideas? Thanks, Peter

Seems to look the same for me in both Safari and Firefox.

In Firefox, clear your browser cache and then try reloading your page. See if that makes any difference.

Hi Adam, done that – no change in appearance. Weird

Share screenshots with us what you’re seeing – both the good and the bad.

Firefox:

Safari

Odd, it looks A-OKAY here in Firefox:

Have you checked to ensure you’re up to date, using the latest version of Firefox?

as per Firefox, I am up to date. I guess that it is only my problem if you can see the correct version. Your help is appreciated. If you can think of anything else I should do, please let me know.

It also looks fine in FF for me. While it doesn’t explain why you’re seeing odd rendering, at least it’s another datapoint indicating it’s working correctly.

I tried this and it looks fine in firefox. On a side note, however, it took a very long time to load and I did notice that your images are “png” files so quite larger than a corresponding “jpeg”

Apologies - I’m on an ADSL 1 connection some 6 kms from the exchange (equates to about 1.5mbps on a good day :grinning:)

Hi Greg, this is also weird; all my image files that are included in the RW file are jpg. So, how does to turn into png?

Hi Greg, this is also weird; all my image files that are included in the RW file are jpg. So, how do they turn into png?

Thanks Don

The only image that is a jpg (any browser) is the banner.

The page is not a super heavy page (images 2.91mb, Total 2.29mb). Using optimized Jpegs would improve load time.

It looks fine on Firefox Developer Edition (92.0b9).

Thanks Doug. I am a sculptor not a web developer and pretty naïve accordingly. How do I get the table that you included? And if I upload jpg files, how do they turn into png?

Most browsers have a developer tools built in.

That screen shot is from Firefox, but Chromium (Majority of browsers) and Safari (although you have to turn it on in preferences) also have a similar screen in the tools.
⌥Opt+⌘ Cmd+i will bring up developer tools in most browsers.

You will get a screen that opens at the bottom of the screen. This is from Microsoft Edge Developer (all chromiums will look like this).

You then will select the network tab choose Img, refresh the page once you make the selection.
Once the page is refreshed you should get something like this:

How did you upload them? Are these blocks plugin pages? I never used the blocks plugin (I own it but never even tried it). I use Stacks for about everything.

Well there is nothing I’m aware of that will do that, unless it’s something that blocks does.

Thanks Doug. I looked at all the pages as you suggested and indeed all image files are png. Except the last page “Catalog,” which is the only Stacks page. There everything is jpg. Now I uploaded the images by simple drag and drop to the appropriate positions, those were all original jpg files. A built-in gremlin for sure.

Should I just make all pages Stacks?

I would go stacks all the way. I honestly bought the YourHead plugin Package years ago when I started with RW. I never even use blocks.

I had deleted it, but just reinstalled it and did a quick test (took me a bit to figure it out).

Blocks Plugin seems to convert jpegs to png when you drag them onto the page.

I know little about Blocks Plugin, so maybe there is away not to do that?

But I think you would be much better off using stacks for everything you can. Especially since you own it already. It’s much more flexable and allows you to do fully responsive designs.

I am grateful for you taking time with my problem. Best, Peter

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.