Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Display current Bootstrap v4 size on screen
Inspired by
body:after {
color: #000;
font-family: Helvetica;
font-size: 12px;
padding: 5px;
font-weight: bold;
right: 10px;
position: fixed;
text-align: center;
text-transform: uppercase;
bottom: 10px;
width: 200px;
z-index: 9999;
background: #c0c0c0;
border: solid 1px #000;
@each $name, $value in $grid-breakpoints {
@include media-breakpoint-up($name) {
content: '#{$name} - min-width: #{$value}';

This comment has been minimized.

Copy link
Owner Author

@folbert folbert commented Mar 22, 2017



This comment has been minimized.


This comment has been minimized.

Copy link

@unicornist unicornist commented Feb 20, 2019

After finding your snippet and not finding what I was looking for, I just made it. here it is for those who are looking for a sample bootstrap way of finding bootstrap breakpoints :

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.