Layout and Current Size of the Screen (Mobile, Tablet, Desktop)

This page adds a media query for tablets.

This page is simply showing you the size of the current page in JavaScript. This is pretty useful to create your CSS media queries or whatever you need.

Especially to adapt your layout on mobile devices or tablets.

info

Details: Over here the innerWidth and innerHeight attributes of the window are used.

Bootstrap media queries

Short overview of what media queries are active at the moment. Using Bootstrap version 4 over here. Overview of Bootstrap versions.

d-block d-sm-none
The standard, extra small view (xs) is active.
d-none d-sm-block d-md-none
The small view (sm) is active.
d-none d-md-block d-lg-none
The medium view (md) is active.
d-none d-lg-block d-xl-none
The large view (lg) is active.
d-none d-lg-block d-xl-none
The extra large view (xl) is active.