Baptiste Arnaud Baptiste Arnaud - 7 months ago 31
HTML Question

hidden class bootstrap doesn't work?

Here is my HTML

<div class="container-fluid">
<div class="row">
<div class="header">
<a href="#" class="col-xs-3 col-xs-offset-1 logo"></a>
<div class="col-xs-6 col-xs-offset-1 nav hidden-sm-down "></div>

Here is my CSS

width: 100%;
background-image: url("san_fran.jpg");
background-size: cover;

width: 100%;
background: url("logo-cinetik.png") center center no-repeat;
height: 130px;
min-width: 400px;

background-color: $test-color;
height: 100px;

the div tag has the hidden-sm-down class. It should be hidden when my window is less than a certain point isn't it ?

Here is the result

enter image description here

The red div should be hidden!
How can i do this ?


These are the classes devices based.

Extra small devices Phones (<768px) (Class names : .visible-xs-block, hidden-xs)

Small devices Tablets (≥768px) (Class names : .visible-sm-block, hidden-sm)

Medium devices Desktops (≥992px) (Class names : .visible-md-block, hidden-md)

Large devices Desktops (≥1200px) (Class names : .visible-lg-block, hidden-lg)

Refer this link for more