Basic CSS

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Hello @AtulKumar0001, congratulations for your new solution!

  🎯 Your solution its almost done and I’ve some tips to help you to improve it:

  1.Add transitions to make smoother the interaction while the element gets hovered, you can use a value like transition: all ease-in 0.5s.

  2.Its ever better to use relative units as rem or em that have a better fit if you want your site more accessible between different screen sizes and devices. REM and EM does not just apply to font size, but to all sizes as well.

  3.Use a CSS reset to avoid all the problems you can have with the default CSS setup, removing all margins, making the images easier to work, see the article below where you can copy and paste this css code cheatsheet: https://piccalil.li/blog/a-modern-css-reset/

  ✌️ I hope this helps you and happy coding!

  Marked as helpful

  0
• 

  Hyron•5,870

  @hyrongennikePosted about 2 years ago

  Hi,

  Congrats on completing the challenge a job well done, just one small replace the margin with padding on the card so that it goes all around.

  .card {
      padding: 1.3rem;
  }
  

  Once you feel all the requirement in the brief has been met you can add extra things to test yourself. see my NFT card solution below.

  my soution

  Hope the above helps

  Marked as helpful

  0

  ---

  

  Atul kumar•200

  @AtulKumar0001Posted about 2 years ago

  @hyrongennike Hello, After reading your comment, I realised that I typed margin instead of padding in my style. CSS file 😅 Thank you for your reply. I wasn't going to check if you hadn't replied. And I would like to ask you a question about how you make your height and width exactly the same as the design preview.

  0

  

  Hyron•5,870

  @hyrongennikePosted about 2 years ago

  @AtulKumar0001 Hi just by eyeballing and it's not necessary to set a fixed height because elements will most likely overflow on mobile just get you padding and margins as close to the design as possible the same goes for the width just guessing and testing to see what looks close.

  Marked as helpful

  0

  

  Atul kumar•200

  @AtulKumar0001Posted about 2 years ago

  @hyrongennike I get it. Thanks.

  0
• 

  Atul kumar•200

  @AtulKumar0001Posted about 2 years ago

  @correlucas Hey, thanks for the suggestion. It was helpful. And I want to ask you: should I always use rem, or are there some particular situations where I should use rem, em, or %? If so, would you kindly offer some?

  0

  ---

  

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  @AtulKumar0001 I ever usem rem, percentage I use to divide some elements under a specific container, for example a div with 1000px with two child divs, you can use width 30% and width 70% to divide the two child's with the percentage from the parent size

  Marked as helpful

  0

  

  Atul kumar•200

  @AtulKumar0001Posted about 2 years ago

  @correlucas I get it. Thanks.

  0