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![](https://ecs-static.teamtreehouse.com/assets/views/marketing/shared/community-banner-white-47072046c51352fe6a69f5e691ff5700b28bb11d45197d7bdf066d9ea3f72d0c.webp)
![Vamsi Pavan Mahesh Gunturu](https://uploads.teamtreehouse.com/production/profile-photos/1140252/micro_IMG_20140618_161850198.jpg)
Vamsi Pavan Mahesh Gunturu
4,541 PointsHow does center positioning work?
In the video instructor made top,right,bottom and left as 0. And said that it will work only when margin is auto. And he used ::after. They all seem new to me. can anyone explain in detail?
1 Answer
![Irina Blumenfeld](https://uploads.teamtreehouse.com/production/profile-photos/1324142/micro_Las_Vegas-62.jpg)
Irina Blumenfeld
9,198 PointsHere's a great guide about Centering in CSS: https://css-tricks.com/centering-css-complete-guide/
It depends if it's an inline item or a block level element.
If it's a block level element, and it has a set width, to center it, you can set left and right margin to auto, and in CSS shorthand it looks like this:
.element {
margin: 0 auto;
}
top and bottom margin is set to 0, and right and left to auto
If it's an inline element, or inline-block (like links or text), you can center it horizontally like this:
.element { text-align: center; }
Vamsi Pavan Mahesh Gunturu
4,541 PointsVamsi Pavan Mahesh Gunturu
4,541 Pointswhat about inline?
Antonio Jaramillo
15,604 PointsAntonio Jaramillo
15,604 PointsI think that you set text-align: center for inline content, as you can't set any margins or padding to an inline element. Or you can center it's parent container if said parent container is a block or inline-block element.