Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • April 3, 2015 at 4:27 pm #423144
    fusion01

    HI, this is nothing new and been an issue for a long time.

    http://freelancewebdesign.co.za/work/imaginarium-branding-web-development/

    If you scroll down you will see a painbrush graphic appear top right. Set within a colour section as a background, fixed, top right, no-repeat. It is a PNG at 370 x 240 pixels.

    On my Google Nexus 7 2013 (mk2) device that icon is gigantic, fills the entire width (with much cropped off) and completely distorted (lines blurred) on both Chrome and Firefox. It doesn’t scroll, it’s just hogging the entire screen.

    On Firefox, part of it even sits OVER the strip above (title: Brand Development, Print… etc).

    April 5, 2015 at 6:39 pm #423690
    Andy

    Hey fusion01!

    I don’t have a Google Nexus 7, but on chrome emulator it looks fine to me. Could you fix it? Please send us screenshots of what you see (imgur.com or public dropbox).

    Just to let you know: You can only control the whole color section via CSS, but not only the background image of a color section.

    Feel free to make a feature request for Kriesi here: kriesi.at/support/enfold-feature-requests/

    Best regards,
    Andy

    April 6, 2015 at 9:44 am #423851
    fusion01

    Hi Andy, thanks for your response. This is not a new request.
    http://freelancewebdesign.co.za/work/imaginarium-branding-web-development/

    Here are screenshots with labels I’ve added (in red):

    andrewb.co.za/misc/bg-im/01-nexus.jpg
    andrewb.co.za/misc/bg-im/02-nexus.jpg

    Compare please with your desktop browser(s). There is another thread I opened with same issue but different website. I’ve received no reply to that. I have screenshots for that too, but will hold off on those and not add to this thread.

    What I see on my Nexis in the background image displaying at normal size (100%) for literally a milisecond, then it re-renders as you see here, with huge increase in scale. Might give you a clue as to why?

    April 7, 2015 at 4:05 am #424397
    Andy

    Hi!

    try to get control over the background image with this code:

    @media only screen and (max-device-width: 767px) {
.avia-section {
background-size: 100% !important;
}}

    Hope this helps.

    Cheers!
    Andy

    April 7, 2015 at 6:09 pm #424861
    fusion01

    Yeah this was good, I’m happy with the outcome, cheers :)

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Background images massively distorting in scale on mobile’ is closed to new replies.