0

So I was trying to use Material Icons from Google with class names instead of content inside <i> or <span>.

I found a solution in how to use google material icons as class instead of <i> tag, but then I realized that what I really wanted to achieve was to use this for all material icons defined in my page, so I am looking for a generic solution.

I thought about something like the following.

Having:

<i class="material-icons foo"></i>

Where foo is whatever icon name.

I want to achieve something like:

.material-icons:after {
    content: "foo"
}

This way I could use this generic CSS rule for using all material icons by class name.

So the question is:

Is there any way using CSS (or sass) to get the "foo" second class inside selector of "material-icons" first class of the <i> element?

Any help will be appreciated, thanks! :)

Elliot RG
  • 71
  • 1
  • 8
  • Possible duplicate of [How to set the CSS content property with a Google Material Icon?](https://stackoverflow.com/questions/40194077/how-to-set-the-css-content-property-with-a-google-material-icon) – Andrew Apr 07 '19 at 02:10
  • That question doesn't answer what I'm looking for actually...look that what I want is to have a **generic** CSS way to get the second class of a material-icons element, where this second class is, in fact, the icon name. – Elliot RG Apr 07 '19 at 21:39

0 Answers0