"Responsive Helper"
Bootstrap 3.2.0 Snippet by haubek

Post to Facebook Tweet this

1
2
3
4
5
6
7
8
9
10
11
12
<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="responsive-helper">
<span class="label label-danger visible-xs">xs</span>
<span class="label label-warning visible-sm">sm</span>
<span class="label label-info visible-md">md</span>
<span class="label label-success visible-lg">lg</span>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// Responsive Helper
.responsive-helper {
z-index: 1060;
position: fixed;
width: auto;
}
.responsive-helper .label {
height: 50px;
border-radius: 0;
font-size: 30px;
text-transform: lowercase;
color: white;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Vue Material Kit PRO
Responsive Invoice template
Responsive Data Cards (Bootstrap 4)
Responsive Event Html template bootstrap 4

Questions / Comments: