Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

My-Frontend-Mentor-Blog-preview-card-project

j124klo 40

@j124klo

Desktop design screenshot for the Blog preview card coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I made good looking side. I even added this small blinking animation. Next time i would try to make better text (when you open the page on a phopne, h1 gets folded into next line instead of decreasing font size to ajust).

What challenges did you encounter, and how did you overcome them?

I had to learn how to use "@font-face".

What specific areas of your project would you like help with?

How can i make my code look more professional.

Community feedback

@saul-gustavo

Posted

Hello, I saw your html and css code and it is clear what you wanted to do, I recommend using the following:

*, *::before ,*::after {
      margin: 0; 
      padding: 0;  
      box-sizing: border-box; 
}

this way you will eliminate all the margins and padding by default, in the animation section you can only put a hover effect on the text, like this:

text:hover {color: yellow;}
1

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord