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

Igor Kałużny
Igor Kałużny
4,337 Points
Posted by Igor Kałużny
Igor Kałużny
4,337 Points

Centering a general class vs a specific class.

Hi, I'm confused why certain property values doesn't work when applied to more general classes, but apply when set to more specific classes. For example:

HTML
<div class="general">
   <p></p>
<div class="specific">
   <img>
</div>    specific
</div>    general

CSS
.general { 
margin: 0 auto; } - doesn't center img in .specific

.specific { 
margin: 0 auto; } - centers img

2 Answers

bhuwan shrestha
PLUS
bhuwan shrestha
Courses Plus Student 8,489 Points
bhuwan shrestha
bhuwan shrestha
Courses Plus Student 8,489 Points

Margin: 0 auto; CSS rule will centre the HTML element that it has been defined but it doesn't centre it's content. Either you can use text-align property or you can define the margin: 0 auto rule to the child element that you want be centred.

Jacob Mishkin
Jacob Mishkin
23,117 Points
Jacob Mishkin
Jacob Mishkin
23,117 Points

Its not classes, but rather HTML scope you are looking at. I think this simile may work: think of the parent div or the (div with the class of general) as a house and the child div(div class specific) as a room in that house. if you wanted to move the house you can, but the room inside the house stays the same, and if you wanted to change the size of the house the you can, and the room will also change in proportion of the house (if using % for widths). Now to change a room, you need to select the room and to change this, you need to select the child div inside the parent.

Igor Kałużny
Igor Kałużny
4,337 Points
Igor Kałużny
Igor Kałużny
4,337 Points

Thank you very much so the problem wasnt in the code but in my understanding of html.