Menu
I need to change the border width of the icon - fa-comment-o. Can we change the border-width size with css?
228
To increase fa-border-all font awesome icon size, use the fa-lg (33% increase), fa-2x, fa-3x, fa-4x, or fa-5x classes along with icon class fa-border-all. Increase in icon size will be relative to their parent container.
HTML tags can be formatted using a style attribute. To add a border using the style attribute, add the border CSS inside the quotes after style=. In the example below, we surrounded a paragraph (<p></p>) with a solid red border that is 3 pixels wide. First example with text surrounded by a red border.
Use the -webkit-text-stroke Property to Apply Borders to Font in CSS. We can use the text-stroke property on a text to apply borders to a font in CSS. We need to use the webkit prefix ahead of the text-stroke property to use the feature. However, it only works on the web-kit based browsers like Safari and Chrome.
To use font awesome icons as CSS content code follow the below steps. Add a unique CSS class name to the icon element you want to use. Set the font-weight css property as 900 (For Solid), 400 (Regular or Brands), 300 (Light for pro icons). Set the content css property to the unicode value font awesome icon.
Yes you can. Use a text-shadow:
.my-icon { text-shadow: 0 0 3px #000; } Or Also you can use webkit text stroke remember it only work with Chrome and Safari
CSS-Tricks example
-webkit-text-fill-color: white; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: black; 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
