Skip to content
Submitted about 1 year ago

Order Summary Component

Priyanka Roy Choudhury•100
@PriyankaRC16
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

Hi everyone!

I hope this message finds you well.

I have completed my third project on the Order Summary Component. I found this project a bit challenging in terms of the width of the screen size.

Please feel free to share your feedback for the following:

Currently the width of the page is too wide and there is too much of white space at the side. There is a horizontal scroll bar which allows me to scroll and there is too much white space. Can anyone tell me how I can remove the white space at the side or how do I fill up the white space?

Any other feedback will be greatly appreciated. Your considered feedback is of great importance to me, and I genuinely look forward to your expert insights.

Thank you for your time and attention.

Warm regards,

Priyanka

Community feedback

  • Ben-Lindsey Horn•60
    @hornjblPosted about 1 year ago

    Hi Priyanka, well done on completing the challenge! Just three quick observations I can make:

    1. The font doesn't seem to be set to the font given in the style-guide.
    2. The line-height looks a bit too much.
    3. The box with the price and music icon should be the same width as the button.

    Hope that helps. Good luck if you are going to try it again. I would suggest not trying to refactor the current solution if you are still new at this, but instead starting over again from a clean-slate. Go at it again from scratch, until the concepts start sinking in. Just a tip, from one newbie to another :-)

    PS. With regards to the spacing on the sides, look at implementing a CSS reset (just google around for this) so it removes a lot of the additional margins and padding. Then, play around with margins and padding on the container elements.

    Marked as helpful
    0
    Priyanka Roy Choudhury•100
    @PriyankaRC16Posted about 1 year ago

    @hornjbl Thank you so much

    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