Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Changing font color of HTML Symbol

i am having an issue when changing the color of a HTML Symbol, what i have is this

<span style="color: rgb(42, 170, 82);">&#9899;</span>

and for some odd reason on some google chrome did not change the font color (works fine on IE, FF and most of GC), if anyone know something about this issue please enlighten me. Thanks

like image 909
LPZadkiel Avatar asked Jan 08 '18 14:01

LPZadkiel


People also ask

How do I change the color of a text in HTML?

How to Change Font Color in HTML. To change font color in HTML, use the CSS color property. Set it to the value you want and place it inside a style attribute. Then add this style attribute to an HTML element like a paragraph, heading, button, or span tag.

How do I change the font size in HTML?

HTML Fonts are important for any website. You can change the font size of the text using CSS property (font-size: values here). Set font size in px, % or em. Use CSS, (color: color name here) color property to give color to the text. Use CSS, (font-family: font name here) Property to give different font face to your text. What is the HTML font?

How can I change the color of text in a 16P font?

It's the same as 64 pixels, because 16px makes 1rem unless you change the root font-size ( html) to another value. To change the color of the text, you can use the style attribute, and then set a value with the color property: Combining the font-size and color properties gives us this in the browser:

How to change the font color with external CSS?

This stylesheet is responsible for all the styles on your site and specifies the font colors and font sizes, margins, paddings, font families, background colors, and more. In short, the stylesheet is responsible for how your site looks visually. To change the font color with external CSS, you’d use selectors to style the parts of HTML you want.


2 Answers

FIX:

<span style="color: rgb(42, 170, 82);">&#9899;</span>

<span style="color: transparent;  text-shadow: 0 0 0 green; ">&#9899;</span>

<span style="color: transparent;  text-shadow: 0 0 0 rgb(42, 170, 82); ">&#9899;</span>

This works for Chrome hope it helps you bro.

like image 128
Ylama Avatar answered Sep 29 '22 22:09

Ylama


This appears to be an issue with Chrome, but you can workaround it using text-shadow...

span {
  color: transparent;
  text-shadow: 0 0 0 rgb(0, 128, 0);
}
<span>&#9899;</span>
like image 40
sol Avatar answered Sep 29 '22 22:09

sol