Skip to content
Submitted 8 months ago

blogPreviewChallenge

PhilippeItsMe•110
@PhilippeItsMe
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?

What a ride ! Yes ! I found a way to put my box in the middle of the windows. Yes ! Now, I manager size font with REM

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

Tks to Discord and it's great community.

I had a lot of feed-back. To be honest, as I am new in coding, there a still a lot that I didn't even understand.

However, programming is FUN

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

I didn't succeed centering the "Greeg Hooper" : /

Community feedback

  • yas-avocad•380
    @yas-avocadPosted 8 months ago

    For 'Greg Hooper' and his profile image, you can use vertical-align: middle for both of those elements. Or if you're using flex, try align-items: center.

    Also, you can use border-width: to control the width of the border- you can make it thinner.

    And don't forget to set line-height: for the paragraph in content. That's how you get the spacing in-between each line so the text has some space to breathe.

    :)

    Marked as helpful
    0
    PhilippeItsMe•110
    @PhilippeItsMePosted 8 months ago

    @yas-avocad Tks for your feedback. I will check vertical-align: middle. : )

    1
  • Thomas Dimnet•250
    @tdimnetPosted 8 months ago

    Great job :) I'd suggest to be aware of alt attributes :

    alt="blogIllustration"

    This text will be read by a screen reader. It was to mean something.

    Same goes here:

    alt="portraitGregHooper"

    You could write for example Greg Hooper. By default, screen readers read "image of".

    Other than that, it's great 👍!

    0

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