orientation check

... without using innerWidth aso.

by Ercan Cicek

HTML

<div></div>

CSS

div {
  width: 150px;
  text-align: center;
}

.istrue {
  background-color: green;
  color: black;
}

.isfalse {
  background-color: red;
  color: white;
}

JavaScript

(function() { 
var ua = window.matchMedia("(orientation: portrait)").matches; // --- the actual check
var el = document.getElementsByTagName("div")[0];
el.innerHTML = "is portrait: " + ua + "";
el.className += "is" + ua;
})();