Here's another trick. The default phpBB CSS for the icon class is this:Most of this is fine IMO, but it benefits from a couple of tweaks.The main points here are the font-size and line-height. Setting them to inherit seems to give better overall results, because funnily enough it means the icons start out matching the associated text for size and line-height. In some places it can also be an advantage to set .icon width to auto, to override the default .fa-fw class that sets width to 1.28...em (which is 16px, when combined with the default 14px size). Also, if you want it centred, you might want to override this too:TBH I think FA is a fairly mediocre set, because the icons are not consistent in size or visual weight, but I haven't bothered looking for a better alternative yet.
Code:
.icon, .button .icon, blockquote cite:before, .uncited:before {display: inline-block; font-family: FontAwesome; font-weight: normal; font-style: normal; font-variant: normal; font-size: 14px; line-height: 1; text-rendering: auto; /* optimizelegibility throws things off #1094 */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}Code:
.icon, .button .icon {display: inline-block; font-weight: 400; font-style: normal; font-variant: normal; font-family: FontAwesome; font-size: inherit; line-height: inherit;}Code:
.icon::before { padding-right: 2px;}Statistics: Posted by Gumboots — Tue Apr 01, 2025 8:27 pm