Community feedback

• 

  Ivan•2,630

  @isprutfromuaPosted over 2 years ago

  Frontendmentor

  Hi there. You did a good job 😎

  keep improving your programming skills

  your solution looks great, however, if you want to improve it, you can follow these steps:

  ✅ don't use tag selectors. When you add CSS directly on tags, your markup can’t change. Your style is tightly coupled to your DOM, and any change increases the risk of breaking things.

  .attribution a 
   h1, .info 
  .item p
  

  ✅ place the Google import code such that it loads first directly after the html HEAD tag, EVEN before loading the CSS file. This ensures the fonts load before the CSS so there isn't any unexpected "jumping" of when the font finally loads.

  ✅ choose a naming convention , methodology, or framework and stick to it.

  ✅ use code formatters for structuring your code. It’s very important. As programs get more complex, they get harder and harder to understand - and at some point you can’t even understand code that you yourself wrote without being able to re-read it. Good style makes reading code a pleasurable and consistent experience.

   <div class="card-image">
          <div class="overlay"></div>
          </div>
        </div>
  

  ✅ You Should Stop Using Pixels. They are static and aren’t truly relative to the root font-size like REM and EM units

    .container {
      width: 325px;
      height: 600px;
    }
  

  I hope my feedback will be helpful. You can mark it as useful if so 👍

  Good luck and fun coding 🤝⌨️

  Marked as helpful

  0

  ---

  

  Adrianna Thomas•70

  @adrianna-thomasPosted over 2 years ago

  @isprutfromua

  Thanks so much for the detailed feedback and tips about improving my solution. Instead of using tag selectors should I just use IDs and classes? Do you mean that I should be placing the imported font link in the html HEAD tag in addition to having it in the CSS file?

  0

  

  Ivan•2,630

  @isprutfromuaPosted over 2 years ago

  @adrianna-thomas Hi there

  Yes, you are right. Use classes instead of tags and place font links into the head section.

  Cheers, peace and happy coding!

  0