Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS How to Make a Website Styling Web Pages and Navigation Style the Portfolio

Hernan Martin Demczuk
Hernan Martin Demczuk
1,264 Points
Posted by Hernan Martin Demczuk
Hernan Martin Demczuk
1,264 Points

What's a parent element?

Suppose that you have a wrapper and inside of it (nested in the HTML code) there are images. Would one of these images automatically be a child of the wrapper (parent) if there was any other element nested above?

If the answer is yes: Why does an image with a width of 50% set its width according to the screen and not to the wrapper?

2 Answers

eck
eck
43,038 Points

In the scenario you mentioned, all images in #wrapper would be children of #wrapper.

About the width you are mistaken. if you give the images width: 50%; then they are half the width of #wrapper. Since #wrapper is likely a block element (like a div, section or article), it will have a default width of 100%. So if you do not declare any widths for any parent elements, then the screen width is used as the width for all block elements.

I hope that helps!

akc
akc
11,729 Points
akc
akc
11,729 Points

Parent element sometimes will contain the child element's dimension, but not always. There are two ways that I can think of without seeing your code that would help the parent to contain the dimension:

1) Give parent element a dimension (fixed height and width)

2) Use the position property. Give parent "position: relative", and give the child element "position: absolute".