device_media_queries.html | Explore in Territory

<html>
<head>
<style>
body {
    margin: 0;
    min-height: 1000px;
}
#test {
    width: 100px;
    height: 100px;
}
@media all and (device-width:700px)
{
    #test { width: 300px; }
}
@media all and (max-device-width:699px)
{
    #test { width: 200px; }
}
@media all and (min-device-width:701px)
{
    #test { width: 400px; }
}
@media all and (device-height:500px)
{
    #test { height: 300px; }
}
@media all and (max-device-height:499px)
{
    #test { height: 200px; }
}
@media all and (min-device-height:501px)
{
    #test { height: 400px; }
}
</style>
</head>
<body>
<div id="test"></div>
</body>
</html>

chromium/third_party/blink/renderer/core/testing/data/device_media_queries.html