The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Do media query-specific background images load regardless of media query?

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #43939

    Hi guys

    I am building a mobile-first website with all CSS served on one compressed stylesheet using media queries.

    Now lets say I have a background image for a selector in the default css (no media query, mobile-first) which is 20k in size.

    At media query with screen widths above 800px, that same CSS selector calls a different version of the background image which weighs in at 60k.

    My question is, as the whole stylesheet gets downloaded before rendering the page, does that 60k image load on mobile, even though it won’t be displayed? Or does that only load for screen sizes above 800px?

    Thanks in advance


    this page describes many situations

    if you are using a media query to just change the background property at a certain width then no it doesnt get downloaded until the width requirement is met(test 5 in the article)


    Thanks @pixelgrid that is exactly what I was after, and excellent article (bookmarked!)

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.