1 <section id="rotated-flipped">
2 <h2 class="page-header">Rotated & Flipped</h2>
4 <div class="col-md-3 col-sm-4">
5 <p style="font-size: 18px;">
6 <i class="fa fa-shield"></i> normal<br>
7 <i class="fa fa-shield fa-rotate-90"></i> fa-rotate-90<br>
8 <i class="fa fa-shield fa-rotate-180"></i> fa-rotate-180<br>
9 <i class="fa fa-shield fa-rotate-270"></i> fa-rotate-270<br>
10 <i class="fa fa-shield fa-flip-horizontal"></i> fa-flip-horizontal<br>
11 <i class="fa fa-shield fa-flip-vertical"></i> fa-flip-vertical
14 <div class="col-md-9 col-sm-8">
16 To arbitrarily rotate and flip icons, use the <code>fa-rotate-*</code> and <code>fa-flip-*</code> classes.
19 <i class="fa fa-shield"></i> normal<br>
20 <i class="fa fa-shield fa-rotate-90"></i> fa-rotate-90<br>
21 <i class="fa fa-shield fa-rotate-180"></i> fa-rotate-180<br>
22 <i class="fa fa-shield fa-rotate-270"></i> fa-rotate-270<br>
23 <i class="fa fa-shield fa-flip-horizontal"></i> fa-flip-horizontal<br>
24 <i class="fa fa-shield fa-flip-vertical"></i> icon-flip-vertical