Warum folgt mein Bild nicht der Divs-Klasse?

Question

Ich bin sehr neu, hier zu HTML ist mein Code:

.social-media { 
 
    height: 100px; 
 
    width: 100px; 
 
    border-radius: 25px; 
 
}

<div class="social-media"> 
 
    <a href="https://twitter.com/mytwitter" target="_blank"> 
 
    <img src="http://icons.iconarchive.com/icons/limav/flat-gradient-social/256/Twitter-icon.png" alt="my twitter"> 
 
    </a> 
 
</div>

das twitter Bild von der CSS verändert sich nicht

Answer 1

starten:

.social-media img { 
    height: 100px; 
    width: 100px; 
    border-radius: 25px; 
    } 

Answer 2

Fügen Sie einen separaten Stil für das Bild hinzu, damit es die gesamte Breite des übergeordneten Elements ausfüllt

.social-media { 
 
    height: 100px; 
 
    width: 100px; 
 
    border-radius: 25px; 
 
    } 
 
    .social-media img{ 
 
    width: 100%; 
 
    }

<div class="social-media"> 
 
    <a href="https://twitter.com/mytwitter" target="_blank"><img src="http://icons.iconarchive.com/icons/limav/flat-gradient-social/256/Twitter-icon.png" alt="my twitter"></a> 
 
</div>

Answer 3

CSS zielt nicht das Bild direkt:

1. geben Sie Ihrem Bild eine Id oder der Klasse, so dass Sie zielen, dass speziell

.social-media-image { 
 
    height: 100px; 
 
    width: 100px; 
 
    border-radius: 25px; 
 
}

<div class="social-media"> 
 
    <a href="https://twitter.com/mytwitter" target="_blank"> 
 
    <img class="social-media-image" src="http://icons.iconarchive.com/icons/limav/flat-gradient-social/256/Twitter-icon.png" alt="my twitter"> 
 
    </a> 
 
</div>

2. Sie das Bild direkt von der Social-Media-Klasse

.social-media img { 
 
    height: 100px; 
 
    width: 100px; 
 
    border-radius: 25px; 
 
}

<div class="social-media"> 
 
    <a href="https://twitter.com/mytwitter" target="_blank"> 
 
    <img src="http://icons.iconarchive.com/icons/limav/flat-gradient-social/256/Twitter-icon.png" alt="my twitter"> 
 
    </a> 
 
</div>

Check-out link, wie CSS-Selektor Arbeit

Ziel könnte