Skip to content
Submitted 4 months ago

Blog preview card main

Rafig•70
@refikmemmedov
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Blog preview card
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

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

I didn't do much this time. I am still aiming to improve myself and trying to consolidate HTML and CSS.

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

I found it difficult to translate it to the mobile side. I have difficulty making responsive design

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

I'm currently asking for help from someone on the responsive design.

Community feedback

  • Yash Bhatt•280
    @Y-ashbhattPosted 4 months ago

    Nice Solution!

    As for responsiveness, websites are inherently responsive and most of the time it's our CSS that breaks them lol.

    As for your code the problem is the width in main class.

    Avoid setting fixed width values for elements like this. You've set width: 100vw. 100VW would represent 100% of the viewport's width, or the full width of the screen. % reflects a percentage of the parent element's size, regardless of the viewport's size. Instead, you can set a max-width to it or give it no width.

    Go through the LEARNING PATHS. I'm learning responsive design through them, they're pretty good.

    Hope it helps you.

    Marked as helpful
    2
    Rafig•70
    @refikmemmedovPosted 4 months ago

    thank you very much for the comment @Y-ashbhatt

    1

Please log in to post a comment

Log in with GitHub

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