Css helpers
Contents
Visible and hidden classes
Argento provides Bootstrap visible-* and hidden-* classes, to help you to
organize custom content.
Examples:
<!-- Visible on the phones only -->
<img class="visible-xs-block" src="..." alt="..."/>
<!-- Hidden on the phones -->
<img class="hidden-xs" src="..." alt="..."/>
Please read official Bootstrap documentation for more information.
Responsive embed
You can use Bootstrap embed-responsive class to make any video content responsive.
Examples:
<!-- 16:9 aspect ratio -->
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="..."></iframe>
</div>
<!-- 4:3 aspect ratio -->
<div class="embed-responsive embed-responsive-4by3">
<iframe class="embed-responsive-item" src="..."></iframe>
</div>
Please read official Bootstrap documentation for more information.
Text and block alignment classes
Examples:
<!-- Center text inside a div -->
<div class="a-center"></div>
<!-- Center div with a defined width -->
<div class="a-center-block"></div>
<!-- Float block to the left -->
<div class="pull-left"></div>
<!-- Float block to the right -->
<div class="pull-right"></div>