I am using Flaticon for a website I am developing but there seems to something wrong and I can't find out what.
I downloaded the zip file from flaticon with the option "icon font".
so I uploaded it into the my font's folder but for some reason when I link the css and put an <i class="flaticon-crowd"><i>
in my html I get the icon in its default size but when I put font-size:70px;
in the css it doesn't get bigger.
I can do color: #f00;
and the text turns red so it's not the selector.
Also in the def tools in chrome show that the 70px font-size is used and not overruled.
Does somebody know what it could be that is causing this problem ?
thanks for your time.
Here is an example of the html I use
<!DOCTYPE html>
<html>
<head>
<!-- flaticon -->
<link rel="stylesheet" type="text/css" href="assets/css/flaticon/flaticon.css">
<title></title>
</head>
<body>
<i style="font-size: 70px" class="flaticon flaticon-crowd"></i>
</body>
</html>
Try from an incognito window. Try from a mobile device not connected to wifi. Clear cache and delete cookies. Uninstall any adblockers you may have in your computer.
Larger Icons To increase the size of icons relative to its container, use icon-large , icon-2x , icon-3x , or icon-4x . Increase the icon size by using the icon-large (33% increase), icon-2x , icon-3x , or icon-4x classes.
Use this class in your css to change the font size.
[class^="flaticon-"]:before, [class*=" flaticon-"]:before, [class^="flaticon-"]:after, [class*=" flaticon-"]:after { font-size: 150px; }
Hope it will solve your issue.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With