Social proof section challenge

👾Hello @mdaifi1337, Congratulations on completing this challenge!

Great code and great solution! I’ve few suggestions for you that you can consider adding to your code:

You did a really good work here putting everything together, something you can improve its your code html markup and semantics. You can replace the <div> that wraps each card with <article> you can wrap the paragraph with the quote with the tag <blockquote> this way you'll wrap each block of element with the best tag in this situation. Pay attention that <div> is only a block element without meaning.

This article from Freecodecamp explains the main HTML semantic TAGS: https://www.freecodecamp.org/news/semantic-html5-elements/

✌️ I hope this helps you and happy coding!

Hello Med Daifi.

For my solution i used CSS variables and the CSS calc function to align the cards.

my CSS

.card{
    margin-right: calc(var(--mr) * 50px);
}

my HTML

<div class="card" style="--mr: 2;">...</div>
<div class="card" style="--mr: 1;">...</div>
<div class="card" style="--mr: 0;">...</div>

for example if "--mr" is 2, then margin-right: calc(2 * 50px);

Hope this was helpful