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 Molly Christison
Molly Christison
4,882 Points

List Alignment

I can't seem to get all of my text in my list items to align behind the bullet point on my resume. My "profile" list items do it naturally, but my "work experience" text is out of alignment. I've already tried using list-style-position: outside and it doesn't seem to work. Any alternate ways to go about doing this?

Here's my code: https://w.trhou.se/bw63hfm277

1 Answer

Colin Bell
Colin Bell
29,679 Points
Colin Bell
Colin Bell
29,679 Points

You don't have those list items wrapped in a ul.

Also, I would highly recommend refraining from using tables for layout purposes.

Molly Christison
Molly Christison
4,882 Points

What would you recommend I use instead?

Colin Bell
Colin Bell
29,679 Points

Articles, sections, divs, spans. Depends on what the situation calls for. I usually refer to this when trying to decide:MDN-Sections and outlines.

Here's a pretty good write-up of why not to use tables for layout: Don't Use Tables for Layout. Basically, it boils down to maintainability, accessibility. Also, tables aren't very conducive to responsive design either.

You also have multiple of the same id's on the same page. ID is a unique identifier for an element, so there should only be one element on a page that has a specific id. Use class to apply the same stylings to multiple elements.

Colin Bell
Colin Bell
29,679 Points

I'd probably set it up similar to this: codepen example for your experience section