Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

HTML How to Make a Website Styling Web Pages and Navigation Review: Styling Web Pages and Navigation

Rasmus Boll
Rasmus Boll
4,371 Points

Already know the correct answer, but can someone explain it

Hi there,

The quiz question is: "Say we have two floated list items with a width of 45% each. Which of the following declarations, if applied to the list items, will perfectly fill the remainder of the parent element’s width?"

The answers can be: "Margin: 10%;" "Margin: 100%;" "Margin: 2.5%;" "Margin: 0%;"

I already know the correct answer is 2,5. But that is only because I remembered it from watching the video. What I would like to know, is if there is someone who can explain it to me, so I can understand why this is the correct answer. I have watch the video over and over agin, but somehow I still don´t understand it, maybe it is because english isn´t my mother language, is there anyone how can explain it to me like I am a six year old kid??

Tomas Pavlik
Tomas Pavlik
26,726 Points

Nikki si absolutely right - each side takes 2.5% (10% total).

1 Answer

Nikki Bollman
Nikki Bollman
7,281 Points

Here's how I understand it:

We want to make the total width of everything in the parent element equal to 100%. Since the floated list items take up 45% each, together they make up for 90% of the total width. To perfectly fill the remainder, the margins need to take up the remaining 10% of the width. Since there are 4 sides (2 for each list item), we divide that 10% by 4 to get 2.5%.

Moderator Edit: Moved response from the Comments section to Answers.

Rasmus Boll
Rasmus Boll
4,371 Points

Thank you Nikki Bollman, I think I got it now