Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Order summary component

@Cassio-Master

Desktop design screenshot for the Order summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Cada dia evoluindo e criando coisas melhores assim como eu aprendo, aprendo com vocês também como já disse alguém (um cientista): "um dia sem aprendizado é um dia não vivido".

Community feedback

Daniel 🛸 42,650

@danielmrz-dev

Posted

Fala Cassiano!

Parabéns por mais um projeto!

Uma dica:

  • Não use position pra posicionar elementos dentro de container assim. Dá pra posicionar eles usando Flex ou Grid.

position é uma ferramenta que é pra casos mais complexos e se não for bem utilizado, ele acaba com a responsividade e cria alguns bugs, fazendo elementos ficarem uns em cima dos outros e por aí vai. Fora isso, seu código fica muito maior do que o necessário

Pesquisa sobre flexbox e começa a praticar nos seus projetos e eu te garanto que vai ficar mais fácil. Digo por experiência, pois nos meus primeiros projetos aqui, eu sofria muito com posicionamento de elementos, mas depois que aprendi flexbox e Grid, ficou muito mais fácil.

Espero que ajude!

2

@Cassio-Master

Posted

se alguém estiver a ver este post só queria pedir ajuda na imagem do símbolo de música

<html> <img style="position: relative; right: 365px; top: 110px;" src="./images/icon-music.svg" alt="">

estava na posição certa mas o background não estava a diminuir então tive que tirar ele da div e deixar-lho livre alguém me da uma dica sobre isso?

1

Daniel 🛸 42,650

@danielmrz-dev

Posted

@Cassio-Master

Deixei um comentário acima pra te dar uma ajudinha 😊

0

Please log in to post a comment

Log in with GitHub
Discord logo

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