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

@Miftaharif

Desktop design screenshot for the Order summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

demy 190

@Demyttenaere

Posted

Bonjour,

Voici quelques conseils pour ce challenge: Pour espacer vos lignes dans .text p vous pouvez utiliser la commande css "line-height". Le texte pour "proceed to payment" et "cancel order" est trop gros, vous pouvez modifier cela avec "font-size" meme si je me doute que vous le savez. Dans ce challenge vous aviez une partie actives-states dans le dossier design, vous deviez modifier le bouton "change" et les boutons "proceed to payment" et "cancel order" lorsque votre souris passe dessus. Pour faire cela vous pouvez faire : .order a:hover { } .button .btn-pay:hover { } .button .btn-cancel:hover { } Ensuite indiquez vos modifications dans les accolades. Un dernier conseil que je pourrais vous donner c'est de ne pas utiliser autant de <div>, par exemple pour l'icone musique, vous pouvez faire comme ceci : <img class="icon-music" src="./images/icon-music.svg" alt="">

En ésperant que cela vous aides, bon codage !

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