Hide Helpers

Hidden

The element is completely hidden and does not take up space as before.

HTML

<div class="container"> <div class="hidden">Hidden element</div> </div>

SCSS

.element { @extend %hidden; }

Invisible

The element is hidden but it will take up space as before.

HTML

<div class="container"> <div class="invisible">Hidden element</div> </div>

SCSS

.element { @extend %invisible; }