Aspect Ratios

dabblet.css

/**
 * Aspect Ratios
 */

html {
min-height:100%;
}

body {
background:url(//placehold.it/480x480) no-repeat;
background-size:100% 100%;
}

@media (min-aspect-ratio:4/3) {
body {
background-image:url(//placehold.it/640x480);
}
}

@media (min-aspect-ratio:3/2) {
body {
background-image:url(//placehold.it/720x480);
}
}

@media (min-aspect-ratio:16/9) {
body {
background-image:url(//placehold.it/853x480);
}
}


@media (min-aspect-ratio:2.35/1) {
body {
background-image:url(//placehold.it/853x360);
}
}

settings.json

{"view":"split-vertical","prefixfree":"1","page":"css"}