Skip to content
OverviewSolutions
5
Comments
2
Finn Willard
@fwillard

All comments

  • Orisasona Ayoola•90
    @Komans-HubSubmitted about 2 months ago
    What are you most proud of, and what would you do differently next time?

    I am glad that this particular project adapts well to different screen sizes. I am proud of mastering the act of building responsive designs.

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

    I had problems with the fonts and border styling. I read through a resource on web3 schools

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

    Google fonts aren't loading in my projects. Any help would be appreciated.

    Blog Card Review

    3
    Finn Willard•40
    @fwillardPosted about 2 months ago

    The card is cramped on screen sizes above 600 pixels and below ~1400 pixels. It may be helpful to do .container{ width: 90%; max-width: 21.5rem;}.

    This will allow the container to take up 90% of the view on smaller screens, but then stay at a defined width once you reach 21.5rem (344px). This allows the design to still be responsive for all screen sizes, but removes the need for media queries and allows a smother transition between sizes.

    0
  • Finn Willard•40
    @fwillardPosted 2 months ago

    The design looks great on desktop, but for mobile sizes the contents are squished significantly. Adding min-width: max-content; to the body allows the card to fill more of the screen while still remaining responsive for screen sizes wider then 320px

    0