Assessment wanted for box model skill test 1 (Match the width of both boxes)

Is this correct? And what is the best way to solve this problem? I’m going to be completely honest and acknowledge that I just added to the width until it appeared to match the top box from the assessment.

Hi @Keenan and welcome to the community :wave:

Yes, your solution is correct.

Instead of making the width bigger until it matches the first box, you could also calculate the width. When using box-sizing: border-box; the paddings and the borders are also included in the width. So we need to add them to the width of the first box:

left border + left padding + content width + right padding + right border = width of second box
5px         + 40px         + 300px         + 40px          + 5px          = 390px

Does that make it clearer?
Michael

1 Like

OOOOOH definitely!!! That makes it way clearer. I didn’t account for the border and wondered why it was slightly off at 380px. haha Thanks a lot Michael! I greatly appreciate your time and your help. :smiley:

1 Like