Arbeitselement auf Blockspanne Trans nicht

Question

I HERE, einen Freund-Website nur wurde modifiziert und im Grunde hat es folgendes Menü:

der Code für das CSS-Menü Nun sieht so aus:

HTML:

<a class="" href=""> 
    <span class="hamburger">     
     <span></span> 
     <span></span> 
     <span></span> 
    </span> 
</a> 

die span ‚s innerhalb der .hamburger Klasse hat eine Anzeigeeigenschaft von block, aber wenn ich versuche, die folgende Art anzuwenden:

.hamburger > span:nth-of-type(1) { 
     transform: rotateX(45deg); 
    } 

Die Transformation nicht angewandt wird. Warum ? Mir ist bekannt, dass das HTML-Element inline-block oder block anzeigen muss, damit es transformiert werden kann.

Answer 1

es funktioniert, nur nicht spürbar auf horizontalen Linien

.hamburger { 
 
    font-size: 500%; 
 
} 
 

 
.hamburger:hover>span:nth-of-type(1) { 
 
    transform: rotateX(45deg); 
 
} 
 

 
span:nth-of-type(1) { 
 
    background-color: green; 
 
    transition: 1s; 
 
} 
 

 
span span { 
 
    display: inline-block; 
 
}

<a class="" href=""> 
 
    <span class="hamburger">     
 
    <span>1 -</span> 
 
    <span>2</span> 
 
    <span>3</span> 
 
    </span> 
 
</a>