30 #Visibility Visibility
30.1 #Visibility.hide Visibility utility classes
Hide classes
-sf-hidden, -sf-invisible, -sf-transparent
.-sf-hidden
.-sf-invisible
.-sf-transparent
Html
<div class="-sf-hidden">.-sf-hidden</div>
<div class="-sf-invisible">.-sf-invisible</div>
<div class="-sf-transparent">.-sf-transparent</div>30.2 #Visibility.img-fit-cover Image fit cover
-sf-img-fit-cover
Html
<div style="width: 200px; height: 300px"><img src="/assets/svg_new_user_interface.svg" alt="" class="-sf-img-fit-cover"></div>30.3 #Visibility.positions Positions
-sf-absolute, -sf-relative
Absolute position
Relative position
Static position
Html
<div class="-sf-absolute">Absolute position</div>
<div class="-sf-relative">Relative position</div>
<div class="-sf-static">Static position</div>30.4 #Visibility.rotate Rotate
-sf-rotate-90, sf-rotate--90, sf-rotate-180
Rotate 90deg
Rotate -90deg
Rotate 180deg
Html
<div class="-sf-rotate-90">Rotate 90deg</div>
<div class="-sf-rotate--90">Rotate -90deg</div>
<div class="-sf-rotate-180">Rotate 180deg</div>