Skip to content
Submitted about 1 year ago

Reponsive with media queries and hover effects

bem
rami•50
@nikogalvan
A solution to the Blog preview card challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

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

I'm looking to enhance the dimensions of elements in my project. This aspect is proving to be a bit challenging for me, especially as I try to incorporate CSS variables. Any advice or tips you could offer would be greatly appreciated

Code
Couldn’t fetch repository

Please log in to post a comment

Log in

Community feedback

  • P
    Daniele•300
    @dedo-dev

    Hello mate, I have some suggestions for you:

    • Maybe you can wrap the content in the body with main tag and also .attribution in a footer keeping the last one outside the main tag;
    • Probably wrapping the card content with article could be a good solution;
    • There is an accessibility issue people can tab on the card title, it is a link so you need to use the appropriate HTML tags;
    • Try to make the card fully responsive there are some problems on mobile devices;
    • Enhance the dimension of the design it is difficult without a design file, you need to enforce your eyes but definitely, with a PNG it's tough, play around with the value or you'll download a design file for free (2 downloads along the path);
    • About Custom Properties at the moment you use it just to customize the colours of the elements so they can cause any trouble with the rest of the elements;

    Anyway, you have done a good job of solving this challenge, with study and practice everything gets better. For anything else I'm here. Happy coding ✌️

    Marked as helpful

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