Skip to content
Submitted over 2 years ago

order-summary-component-main with flexbox

Filip•110
@fica25
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 had problem to center a image on the top of main-section without gap. (I know for position:relative and absolute , but if I did this then whole main-section will grow) At the end I managed this and centered just with width:100% on my image. This project helped me a lot with flexbox , now I understand flexbox perfectly and ready to use on another pages. I hope you will like this, i tried my best despite of not having PRO membership and i cant see the design clearly like in Figma.

Community feedback

  • Phúc (Scott) Nguyễn•430
    @NationsAnarchyPosted over 2 years ago

    Hey Filip! You were so close with the background image thing, and I know how frustrate that was - since it also took me a while to find the right css style too.

    Here's what I can suggest you to have a look at:

    https://www.w3schools.com/cssref/pr_background-repeat.asp

    Hope this one helps you!

    Phúc (Scott).

    0
    Filip•110
    @fica25Posted over 2 years ago

    @NationsAnarchy hey thanks for advice. I didnt even notice that... Will fix this later . Thanks again

    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