Submitted over 2 years ago

Responsive order summary

@Konstantinchrist

A solution to the Order summary component challenge

Solution retrospective

Hi Guys, I hope you're doing great. I just don't understand why my annual plan is overflowing although I gave it a width of 100%. If you see any other issues in the code please let me know. I appreciate the support :).

Have a great day Konstantin

Code

Couldn’t fetch repository

Please log in to post a comment

Community feedback

Dusan Brankov•860
@dusan-b
Posted over 2 years ago
Hello Konstantin,

to avoid elements from being wider (or taller) than intended, you should add the following rules at the beginning of your CSS:
```
html {
  box-sizing: border-box;
}
*, *::before, *::after {
  box-sizing: inherit;
}
```
Otherwise, padding and border will be added to the specified width or height and cause overflow.

Hope this helps, keep it up!

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