Css breakpoints

Media breakpoints

// Extra small devices (portrait phones, less than 576px)
// No media query for `xs` since this is the default in Bootstrap

// Small devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }

// Medium devices (tablets, 768px and up)
@media (min-width: 768px) { ... }

// Large devices (desktops, 992px and up)
@media (min-width: 992px) { ... }

// Extra large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }

Source: getbootstrap.com

Media breakpoints

The Bootstrap grid system has four classes:
xs (for phones - screens less than 768px wide)
sm (for tablets - screens equal to or greater than 768px wide)
md (for small laptops - screens equal to or greater than 992px wide)
lg (for laptops and desktops - screens equal to or greater than 1200px wide)

Css breakpoints

 /* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {...}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {...}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {...}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {...}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {...}

Similar codes

0 vote414 views1 answer
Outting a border on a map css
CSS
0 vote376 views1 answer
Operador css contain attr
CSS
5 votes370 views3 answers
How to make a dotted hr in css
CSS
1 vote362 views2 answers
Css grid two columns
CSS
1 vote381 views1 answer
Reset id sequence postgres
CSS
-2 votes364 views2 answers
Tailwind border bottom
CSS
-1 vote366 views1 answer
Add shadow to background image css
CSS
0 vote338 views2 answers
How to Reveal Content on Hover with Expanding Corner Tabs in Divi
CSS
55 votes369 views6 answers
Css margin
CSS
35 votes371 views2 answers
Transform properties css
CSS