Or if you want an image:
<div class="rotate-notification"> <img src="https://media.istockphoto.com/id/1144546554/vector/rotating-phone-from-vertical-to-horizontal-position-phone-vector-icon.jpg?s=612x612&w=0&k=20&c=dnBtqmZ7_8Cjk2UubtE_o1gDkaIMvs1kStk45tzmEiY="> </div>css:
.rotate-notification{ display:none; z-index: 999999; background-color: black; width: 100%; height: 100vh; position: fixed; top: 0; left: 0; } .rotate-notification img{ position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 150px; } @media (orientation: landscape) and (max-width: 1024px){ body.is-touchdevice .rotate-notification{ display: block; } }