Skip to content
Submitted about 2 months ago

Blog Card Solution

P
Marcelo Colodetti Filho•90
@MarceloColodetti
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?

Proud to use semantic tags instead of multiple divs and next time i will pay attention to the content size.

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

The box with the main content was not respecting the dimensions I chose and I resolved this by paying attention and changing the size of the contents inside it.

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

I would like to know the difference between the outline and border properties in css.

Community feedback

  • P
    vercthu•120
    @vercthuPosted about 2 months ago

    Oi Marcelo! Bom trabalho! I'm switching to English in case anyone has the same question as you: what is the difference between border and outline? A border is a visual representation of the area of an element, it is purely aesthetic. An outline is a line around the element and has accessibility purposes, such as a person being able to see an active state on a link when they need to navigate the webpage with a keyboard instead of the mouse. You can have a border and an outline in the same element, if you wish, but it's best to leave outlines for accessibility.

    Marked as helpful
    0
  • P
    vercthu•120
    @vercthuPosted about 2 months ago

    Btw, you can solve the dimensions problem by adding "box-sizing: border-box;" in .conteudo in the css file!

    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