An example of using media queries in SVG with the CSS background size property
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
README.md
index.html
star.svg

README.md

media-queries-svg-background-size

An example of using media queries in SVG with the CSS background size property.

Browser requirements

Your browser must support:

  • Scalable Vector Graphics
  • SVG in background images
  • Media queries in SVG documents
  • CSS background-size property

Your browser must also support all of the above features working together. It also helps if your browser has solid UI support for <input type="range">.

As of publication (7 April 2013 if you're wondering) Chrome is the only browser in which this demo works as intended. Other browsers DO, however, support media queries in SVG (except for Internet Explorer 10), and the background-size property.