Atualmente estou com dificuldades de fazer um simples quadrado tipo esse:
 
  
Pois se trata da junção de uma palavra com um pseudo-elemento ::before, porém a imagem não aparece:
 
  
Código:
HTML:
CSS:
.imagem{ display: flex; flex-flow: column nowrap; align-items: center;
width: 5%;
margin: auto;}
.imagem_pseudo{ display: flex; align-items: center; justify-content: center;
width: 100%;
height: 500px;}
.imagem_pseudo_link{ width: 30%; height: 300px; }
.imagem_pseudo_link::before{ background-image: url(./Baby_Yoda.jpg); }
 
            