Submitted over 3 years ago

Card Layout

Krishna Tandon• 10

@krishnatandon1208

Preview site View code

This is a solution for...

Profile card component

HTML
CSS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

Hi, Please provide the feedback for the solution. Whether it is in proper structure or not, how can I make it better if the existing solution is correct.

Community feedback

Renszo Camacho• 1,615

@RenszCamacho

Posted over 3 years ago

Hello mate.

You haven't placed the background-color and the background images, I just can see one. So I have gotten into your code and I did this to fix it. Check if that works for you too.

.master-card-block { background-color: hsl(185, 75%, 39%); background-image: url("bg-pattern-top.svg"), url(./bg-pattern-bottom.svg); background-repeat: no-repeat; background-position: calc(100% - 50vw) calc(100% - 50vh), calc(0% + 50vw) calc(0% + 50vh); height: 100vh; }

Greetings.

Krishna Tandon• 10

@krishnatandon1208

Posted over 3 years ago

Thanks for the feedback :)

For this basic challenge I was more oriented to get the proper html structure.

Can you please comment on that too? Like the div opted or the spans used are they properly used.

I will also make the background changes :)

Renszo Camacho• 1,615

@RenszCamacho

Posted over 3 years ago

@krishnatandon1208 Oh cool. I'm not a guru of HTML not even a good one, I'm learning about the structure and semantics of HTML.

As I see it. You got many divs in your Html, and that's not good.

You can check these challenges, and how they structure their code. Grace, and Szymon Rojek

if you really want to know about that, you can check this link

Krishna Tandon• 10

@krishnatandon1208

Posted over 3 years ago

@RenszCamacho thanks :)

Please log in to post a comment

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