The Optimum Mix of Power and Simplicity

Fine Tune the Mobile View with Custom Media Queries

Easily fine tune the mobile view of your site

Agility 3 automatically resizes fonts, headings, line heights, padding and margin for mobile devices.  This is something Agility 2 never did.  So most of this is automatic and you won’t need to do anything.  BUT if you want to fine tune something you can – quickly and easily.

Agility gives you 6 different media queries to choose from.  2 desktop sizes and 4 mobile sizes.  They are:

  • Desktop – 1280 px
  • Desktop – 1140 px
  • Tablet landscape – 1024 px
  • Tablet portrait – 800 px
  • Phone landscape – 699 px
  • Phone portrait – 415 px

5-27-2015 8-25-21 AM

Change all of the typical font sizes

If you think that Agility’s automatic calculation is too big or too small you can simply change the font size in the appropriate media query.  Agility will automatically recalculate line heights for each device width based on your settings.

5-27-2015 8-27-10 AM

Custom text areas can be adjusted as well

Just like the typical font sizes – if you are using custom text area styles then you can customize the mobile view of those styles as well.

5-27-2015 8-32-44 AM

Change ANYTHING else

In addition to font sizes you can actually change anything using the custom code section of the options.  Now this is primarily for web design professionals and most DIY website builders probably won’t need this – but it is there if you do.

5-27-2015 8-30-51 AM