[Resolved] Mobile friendly font awesome snippet

[Pete]

Just thought I’d share this nifty font-awesome snippet that tells the visitor your website is mobile-friendly…

Use this css to align the desktop icon and colour the checks:

.times-desktop.fa-2x.fa-stack-1x {margin-left:13px;}
.fa-times {color:#1ca827;}
.fa-check {color:#1ca827;}

<span class="fa-stack fa-lg">
  <i class="fa fa-mobile fa-3x fa-stack-1x"></i>
  <i class="fa fa-check fa-2x fa-stack-1x"></i>
</span>				
<span class="fa-stack fa-lg">
  <i class="fa fa-tablet fa-3x fa-stack-1x"></i>
  <i class="fa fa-check fa-2x fa-stack-1x"></i>
</span>	
<span class="fa-stack fa-lg">
  <i class="fa fa-desktop fa-3x fa-stack-1x"></i>
  <i class="fa fa-check times-desktop fa-2x fa-stack-1x"></i>
</span>

[Pete]

You can see it working (on desktops only) here.

[Tom]

Cool, thanks for sharing! 🙂

[Pete]

[Author]

Posts