Utilizando caracteres extraños como identificadores en CSS

Cuando escribimos identificadores para cualquier clase, interfaz, regla… utilizamos palabras cortas que definen a qué nos referimos. En el caso de los CSS es muy típico escribir: contenedor, arriba-izquierda, arriba-derecha… sin embargo, leyendo un post de Kabytes he descubierto una forma más curiosa de hacerlo y a priori, más práctica.

Digo a priori, porque supongo que daría problemas utilizando JavaScript u otras tecnologías que no soporten adecuadamente caracteres Unicode. La verdad es que es muy extraño pero es sólo un ejemplo más del nivel de estandarización en cuanto a juegos de caracteres que se está adquiriendo en entornos hasta de interpretación o compilación.

<div class="□">
   <div class="┌">
    <div class="┐">
     <div class="└">
      <div class="┘">
        contenido
      </div>
     </div>
    </div>
   </div>
</div>