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

Posted by marvelousperson206
marvelousperson206
9,199 Points

Centering list items?

So I have an unordered list, with the list items stacked vertically on top of each other using inline-block, that I would like centered in the middle of the page at all times. But I want the list items to be text-aligned left, while still remaining in the center.

How do I do this without setting different margins at all the break points? I'm sure there is a simple solution to this but I can't seem to find the answer anywhere.

1 Answer

Anthony O'Neill
Anthony O'Neill
8,186 Points

Apply the following to your ul;

ul {
width: /*whatever width you like*/;
margin: 0px auto;
}

li {
width: 100%;
display:inline-block;
}
marvelousperson206
marvelousperson206
9,199 Points

Thanks!!! Was having a mental blank with that one