Can't remove text-decoration from anchor tag?

Question

I can't remove text-decoration from my web and I have tried in many attempts to solve it. Nothing worked. The text-decoration in fact is gone, but, I realized that when I click on my link (anchor tag), and then I go back in the browser, the text-decoration appears again. Why does this happen? is it a bug or should I add more CSS to my code to fix this? and how could I solve this?

Reference of what I tried:

  /*
  a > div p {
    text-decoration: none !important;
    color: white;
  }

  a:link > div p {
    text-decoration: none !important;
    color: white;
  }

  .izquierda a > div p {
    text-decoration: none !important;
    color: white;
  } 
  */

  a,
  a:visited {
    text-decoration: none !important;
    /*color: white;*/
  }

   <div class="opciones">
          <!-- OPCIONES DIVIDIDAS A LA IZQUIERDA -->
          <div class="izquierda">
            <a class="anchor" href="/editar_perfil.html">
              <div class="editar-perfil">
                <img
                  src="http://placekitten.com/200/300"
                  alt="Icono de Editar Perfil"
                  title="Puedes editar la biografía e imagen de tu perfil."
                />
                <p>Editar Perfil</p>
              </div>
            </a>
        </div>
    </div>

Apparently, in the snippet the text-decoration doesn't appear but in my browser it remains (I am using Opera GX). And happens what I explained. This is what appears. The text-decoration is still there.

PD: Apparently, the text-decoration in fact is gone, but, I realized that when I click on my link (anchor tag), and then I go back in the browser, the text-decoration appears again. Why does this happen? and how could I solve this?