Skip to content
Submitted 10 months ago

Blog Card with float layout

Kate•60
@ClickClickKate
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

This is my first ever challenge. Layout is done using float (as that is what I know at the moment).

One thing I couldn't figure out was how to reduce the margin between the artist avatar/name and the bottom of the card.

Any feedback welcome. :)

Community feedback

  • Yordan•160
    @Frame993Posted 10 months ago

    Im also new at this, but I checked the devtools and in the h2.artist-name there is a margin-bottom: 1rem; and a line-height: 3rem; . Try removing it

    Marked as helpful
    1
  • Kamran Kiani•1,210
    @kaamiikPosted 10 months ago

    Great work. you can use negative margin also. and check if the problem is because of span element or not. because the span is an inline element.

    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