Responsive social icons

[is_33]

Hi,

Is there a way to make the social icons responsive?

Thanks.

[christopher]

Hi there,

You can use the @media directive in CSS to make the social icons smaller in different window sizes. The social icons usually use the Font Awesome and they are fonts so if you can select the correct selector in the CSS it is a matter of setting the font size for a specific viewport. For example:

@media (max-width: 767px) {
	.socialiconselector {
		font-size:  13px;
	}
}

The pseudo-code above forces the social icon to be 13px for viewports smaller than 767 pixels.

You can find the selector of your social icons using the Google Chrome Developer Toolbar:

Thank you.