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

brandonlind2
brandonlind2
7,823 Points
Posted by brandonlind2
brandonlind2
7,823 Points

Does anyone why my p tags aren't centering in my divs?

I have a content1 and a content2 div and I cant get the paragraphs in them to center within them

the content styling is on the bottom of the style sheet https://jsfiddle.net/pwnftkpk/6/

.content1 p, .content2 p { text-align: center; background-color: rgba(0,0,0,.02); max-width: 280.34px; }

3 Answers

Livia Dobai
Livia Dobai
21,894 Points
Livia Dobai
Livia Dobai
21,894 Points

Hi! Don't use max-width on the .content1 p and .content2 p elements. If you want to resize the column width, use instead margin left and margin right on the p element.

brandonlind2
brandonlind2
7,823 Points
brandonlind2
brandonlind2
7,823 Points

OK thanks I looked margin and inline elements up, I didn't realize inline could accept left and right margin, but couldnt accept width, for some reason I thought it was the other way around

Owa Aquino
Owa Aquino
19,277 Points
Owa Aquino
Owa Aquino
19,277 Points

Hi!

Have you try removing your max-width?

Iain Simmons
MOD
Iain Simmons
Treehouse Moderator 32,305 Points
Iain Simmons
Iain Simmons
Treehouse Moderator 32,305 Points

As Livia Dobai said, use the left and right margins on the p element. Specifically, with the value of auto if you want the p tag to be centered horizontally. Also, don't use decimal places for pixel values (change max-width: 280.34px; to max-width: 280px;).

If you want to see where the p tags are in relation to your divs, then put a different background color on the divs.