Hello, I am trying to use a set of png icons for icons on my forum on the tags. iv got it to fit in the tag box how it looks nice but that’s for every tags box, iv found how to target specific tags but what would be the right way of selecting that specific tag box to put in the png icon? Any help would be awesome! trying to select one - .tag-question::before { content: url(https://s2.coinmarketcap.com/static/img/coins/16x16/1.png); width: 8px; height: 4px; margin-right: 10px; margin-top: 3px; display:inline-block; } Selecting all - a.discourse-tag.box::before { content: url(https://s2.coinmarketcap.com/static/img/coins/16x16/1.png); width: 8px; height: 4px; margin-right: 10px; margin-top: 3px; display:inline-block; }

You can use css attribute selector Here is an example with the tag question : a.discourse-tag.box[href*="question"]::before { With 400 tags you might need to use something else than the [href*= for some elements. There are a few alternatives to trigger the attribute element. [imagem] W3Schools.com W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

Why not use SVG glyphs instead of PNGs? There’s a component for this at Tag Icons

I was already trying that but with what I am trying to do I would need to try and convert like 400+ png icons to svg and then make all of that an svg sprite and from what iv tried and read there isn’t a fast or good way of converting them and keeping the quality of the original png. I did try with one icon a few times but the quality would usually go down and then when I put it into a sprite I couldn’t get it to load with the theme component.

ah, ty! :grinning: this should work great with what I am trying to do.

Tentando usar CSS para inserir ícones PNG em caixas de tag

Suporte ao Produto

codinghorror (Jeff Atwood) Maio 29, 2021, 8:38pm 2

Por que não usar glifos SVG em vez de PNGs? Há um componente para isso em Tag Icons

Tópico		Respostas	Visualizações
Tag Icons Theme component official , tag-icons	91	21180	3 de Março de 2026
Issue using custom icon with Tag Icons Product Support tag-icons	2	441	19 de Dezembro de 2019
Making tags look like real world tags UX	12	3762	3 de Agosto de 2020
Tag Icons working with tag groups Feature tag-icons	7	423	2 de Outubro de 2025
Matching wrong tag to tag icon Bug tag-icons	6	357	18 de Maio de 2021

Tentando usar CSS para inserir ícones PNG em caixas de tag

Tópicos relacionados