html – Why are IDs working for CSS element when divs are not?

I am working on this website and trying to link my social to the site. CSS is not finished yet but for some reason the div will not work. I tried to give each of them the same ID and it all worked out, but when I changed it to DV class they went back to their original state. I’m super beginner level right now so maybe I’m missing something small but the file is:

<div class="social">
  <a href = https://www.instagram.com/?hl=en target="blank"> <img src="ig logo.png" alt= "insta" >  </a>
  <a href = https://www.snapchat.com/add/ella.dabbagh?share_id=MDFCMzc2&locale=en_CA target="blank"> <img src="snap icon.png" alt="snap"> </a>
  <a href = https://twitter.com/uvic target="blank"> <img src="twitter.png" alt= "twitter"> </a>
</div>

And CSS (sorry how to get this crowd on multiple lines of ID)

.social{flex-direction: column; height:70px; width:70px; border-radius:20px; display: flex; border-style: solid; border-width: medium; color: black;}

CSS information looks fine when it is set to an ID but it will not only work for the class and I really don’t understand why.

Write a Comment

Your email address will not be published. Required fields are marked *