NFT Card Component Challenge

Community feedback

• 

  Oskar•330

  @slothmast3rPosted over 2 years ago

  Hi. Congrats on your second challenge!

  .main-container .image-card div{
    ...
    top: 60;
    ...
  }
  

  you forgot to use any units on top attribute. what i recommend is using position: relative on parent class and position: absolute on child.

  Please avoid using *{...} it makes code unreadable.

  Add some animations to make it look cooler

  Good luck!

  Marked as helpful

  0

  ---

  

  darthTh0t•50

  @darthTh0tPosted over 2 years ago

  Hi @slothmast3r, thank you so much. I have followed tutorials where *{...} was used extensively. I will make sure not to include this line in the future.

  And definitely more thank you for noticing the error.

  0

  

  Oskar•330

  @slothmast3rPosted over 2 years ago

  @arnav-sahoo okay sorry my bad, i didnt look in to your code that much 😅. In this case margin:0 and padding: 0 is reasonable.

  *{
    margin: 0;
    padding: 0;
  }
  

  but in other cases you should be careful.

  Just to be clear what i meant with positions

  <div class="parent">
     <div class="child">
     <div />
  <div />
  
  .parent{
    position: relative;
  } 
  .child{
   position: absolute;
   top: 0;
  }
  

  it positions child relative to parent div.

  0