Flexbox-Problem - Display-Flex funktioniert nicht

Ich brauche Hilfe bei diesem Flexbox-Problem. Spans zeigt nicht, wenn ich flexbox verwende, sie haben keine Breite: 50px mehr.Flexbox-Problem - Display-Flex funktioniert nicht

<div class="mobile-nav-toggle"> 
    <span></span> 
    <span></span> 
    <span></span> 
</div> 


    .mobile-nav-toggle{ 
     width: 50px; 
     height: 50px; 
     background: pink; 
     margin-right: 20px; 
     display: flex; 
     align-items: center; 

     span, 
     span::before, 
     span::after{ 
      content: ""; 
      display: block; 
      height: 2px; 
      background: #333; 
     } 
     }

Quelle

2017-07-12 kamilluis1

Fehlendes schließendes Tag. 2 Zeilen kommentiert. Dies sind die absoluten Grundlagen von CSS, lesen Sie bitte etwas darüber, bevor Sie den Code von woanders kopieren. –

Es gibt schließendes Tag. Ich habe es nicht richtig kopiert. – kamilluis1

bemerkte ich sie absichtlich aus, um die Spannweiten zu sehen. Denn wenn ich flexbox im übergeordneten Container verwende, werden sie nicht angezeigt. – kamilluis1

Scheint so, als hättest du 1 fehlende schließende geschweifte Klammer in deinem CSS bekommen.

.mobile-nav-toggle{ 
    width: 50px; 
    height: 50px; 
    background: pink; 
    margin-right: 20px; 
    display: flex; 
    align-items: center; 

    span, 
    span::before, 
    span::after { 
     content: ""; 
     display: block; 
     height: 2px; 
     background: #333;} 
    }

Working demo ich mit Entwickler-Tools überprüfen, es zeigt die Spannweite 50px Breite hat.

Quelle

2017-07-13 03:53:15

Flexbox-Problem - Display-Flex funktioniert nicht

Antwort

Verwandte Themen