Skip to content
Submitted 3 months ago

BLOG-PREVIEW-CARD-MAIN

RogerTito455•170
@RogerTito455
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?

Well, I think that I developed an hability to make this kind of css html project so easily. I would like to try new things like trying to make it good.

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

Well, I didn't know how to make the borders of the box and the shadow but I overcome using a little bit of chatgpt and gave me an advice.

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

The same as the previous one, I really want to know if my code can be smaller to make it efficient.

Community feedback

  • جهاد أحمد•280
    @Gehad28Posted 3 months ago

    Hi @RogerTito455, nice work!

    You can use border: 1px solid black; to make a thin border in all sides. Then you can use box-shadow: 10px 10px; to make the solid shadow on the right side and the bottom.

    The first number in the box-shadow property is the horizontal offset, a positive value puts shadow on the right side and a negative value puts it on the left side. The second number is the vertical offset, a positive value puts the shadow on the bottom side and a negative one puts it on the top side.

    Hope this helped! ☘️

    Marked as helpful
    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