Submitted over 2 years ago

HTML CSS

Chicaofmp•30

@chicaofmp

Preview site View code

This is a solution for...Order summary component

HTML
CSS

1newbie

Design comparison

SolutionDesign

Solution retrospective

Hi,

Here is my third Challenge. I need to practice my CSS skills, so dont by shy and criticize my work. one of the problems i had was to add background-image(url)... to overpass this i made img position absolut, but i didnt like so much the solution. Next time i need to improve this one.

Lets all improve together!

Thanks

Francisco "Chicaofmp" Moura

Community feedback

Arthur•290
@ArthurPogPosted over 2 years ago
Hey Chacalfmp!

Beginner here! :)

Just wanted to give you my two cents:

Good job on this one. It looks good, for sure.

When I checked the site preview I realized it was only centred horizontally. Do you know how to centre it vertically?

Instead of justifying the content of music-div center, you could have done it space-between just like you did with the .icon-plan-price and you wouldn't need the extra margin-left with the .plan-price.

Setting a base font-size at the html level and then using rem or em to measure paddings, distances and other font sizes across the project is a better idea because if the user has a different default font size in his browser (due to disabilities or poor eye-sight) your content will not break.

Everything (fonts, card dimentions, margins and paddings) is much smaller than the design. If you need help with how to measure a project before you start working on it, lemme know. I came across a few nifty tools while working on my solutions.

These are just small things. Keep up the good work!
Marked as helpful
0

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