Skip to content
Submitted almost 3 years ago

Order Summary component | HTML & CSS

myrdin•80
@myrdn
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Order summary component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

I have a question regarding the <br> in the paragraph, the places of the <br> are different between desktop and mobile screen, does implementing multiple <br>and use display: none | display: block with medias queries is the good way to go ?

If you have a better solution or other feedbacks I will be happy to read.

Community feedback

  • Rosi•440
    @strosiPosted almost 3 years ago

    Hi @myrdn, I don't think you need any <br> element in the paragraph text. Remove them all. Just leave the text fill the width of the container and you may use padding to add some space on the left and right of it.

    Marked as helpful
    2
  • Naveen Gumaste•10,480
    @NaveenGumastePosted almost 3 years ago

    Hay ! myrdin Good Job on challenge

    These below mentioned tricks will help you remove any Accessibility Issues

    -> Add Main tag after body <main class="container"></main>

    -> Learn more on accessibility issues

    If this comment helps you then pls mark it as helpful!

    Have a good day and keep coding 👍!

    0
  • Hexer•3,660
    @EmmanuelHexerPosted almost 3 years ago

    Great job man. How do you get all your measurements right?

    0
    myrdin•80
    @myrdnPosted almost 3 years ago

    @Phalcin I use Pixel Perfect Pro and play with measurements until I find something matching.

    1
    Hexer•3,660
    @EmmanuelHexerPosted almost 3 years ago

    @myrdn kk thanks for the tip.

    0

Please log in to post a comment

Log in with GitHub

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