country-flag-icons

CSS for svg based country flag icons. See the demo.

CSS classes

.flag-icon sets the correct proportions for the flag icon when used inline with text.

.flag-icon-xx sets the background-image with the correct flag, where xx is the ISO 3166-1-alpha-2 code.

.flag-icon-squared for the squared version of the flag.

.flag-icon-background sets the the background to position: 50%, repeat:no-repeat and size:contain.

<span class="flag-icon flag-icon-gr"></span>
<span class="flag-icon flag-icon-gr flag-icon-squared"></span>

This project wouldn't exist without the awesome collection of svg flags: koppi/iso-country-flags-svg-collection