Using css pseudo element in php doesn´t work

Question

My issue is that I had to add in php the tag in order to put there some styles with pseudo element span: before and a content: 'text' in which I have a translation for serveral languages.

Of course, has already been added and the rest of special characters on the file are showed correctly. I have the issue just with the content within . Also I tried with "header('Content-Type: text/html; charset=utf-8');" and nothing changes.

The problem is that is not correctly reading special characters as "í" or "ç", even adding utf8_decode.

Here php code where I already declared the words to be translated

$textoProtecciones = utf8_decode ($trEstatico->_("Protecciones"));
$textoCaracteristicas = utf8_decode ($trEstatico->_("Características"));
$textoCortes_Negativo = utf8_decode ($trEstatico->_("Negativo"));

Here the css style in an tag in the php


<style>
    @media (max-width: 768px) {


        #owlcomparativatable .owl-item.active.center  .item-table .clear.clear_third span:before {
            content: '<?php echo $textoProtecciones;?>';
        }

        #owlcomparativatable .owl-item.active.center  .item-table .clear.clear_fourth span:before {
            content: '<?php echo $textoCaracteristicas;?>';
        }

        #owlcomparativatable .owl-item.active.center  ul.cortes li.features_tablet:first-child span:before {
            content: '<?php echo $textoCortes_Negativo;?>';
        }
</style>

However, even when everything is well declared, in the screen I see "Características". Even in the console code is not reading properly the utf8 code for "í", showing this:

#owlcomparativatable .owl-item.active.center .item-table .clear.clear_fourth span:before {
content: 'Caracter&iacute;sticas';
}

Someone could help me with this?

Possible duplicate of [UTF-8 all the way through](https://stackoverflow.com/questions/279170/utf-8-all-the-way-through) — Dharman, Nov 13 '19 at 11:16
Sure, was already added. In fact, the rest of special characters appear correctly, just this words content in in the php are showed not properly. — cperezsola, Nov 13 '19 at 11:31

score 0 · Answer 1 · answered Nov 13 '19 at 11:39

í is the HTML entity for í. All the characters in it (ampersand, i, a, etc) appear in ASCII so there's no need (or point) to do anything with character encoding.

HTML entities have no special meaning in CSS, so the text is displayed "as is".

You need to convert the HTML to plain (UTF-8) text. Use the html_entity_decode function.

Using css pseudo element in php doesn´t work

1 Answers1