Header gets Blurry, when screen is small

  • hibert42

    (@hibert42)


    9 months ago

    Hi, when I see this page on a small screen, like my phone or my scaled down window… the background header image gets blurry as hell… and gets sharper on the fly, when making the window bigger again.

    What can I do against it. Its not a css Blur, at least I haven’t found anything like that in the code.

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator Felipe Santos

    (@foosantos)

    Hi there,

    Do you have a screenshot or such with an example?

    I couldn’t reproduce it blurry:

    https://d.pr/i/HwP4On
    Full Size: https://d.pr/i/HwP4On

    Thread Starter hibert42

    (@hibert42)

    Sure, here are 3 screenshots.
    1. Large Desktop (Firefox)
    2. Small Window Desktop (Firefox)

    I tested it on Edge… there it doesn’t blur …. weird.

    • This reply was modified 8 months, 3 weeks ago by hibert42.
    Moderator jordesign

    (@jordesign)

    Hi @hibert42 – that’s indeed an interesting one… I can recreate in Firefox as well.

    Would you mind doing an experiment for me – and try to load a smaller width image in that spot ? Maybe 2048 pixels wide (instead of double that)?

    I’m wondering if Firefox is trying to load a smaller version on small screens because that original image is so big.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Header gets Blurry, when screen is small’ is closed to new replies.