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 John Levy
John Levy
1,451 Points

Having issues placing text onto two seperate lines

I have several bullet points and I want to place some of the longer ones onto two lines. The problem is the only way I seem to be able to do this is by changing the width in the code. The issue with this is the background color should span across 100% of the width of the page. What is the best way to make the text fall onto two lines? For example with the text shown in the code the top line will be "12 week" and the second line with be "program". I have attached my code below. http://codepen.io/Johned22/pen/dpmpvb Thanks in advance

2 Answers

Christopher Collins
seal-mask
.a{fill-rule:evenodd;}techdegree
Christopher Collins
Front End Web Development Techdegree Student 6,343 Points
Christopher Collins
.a{fill-rule:evenodd;}techdegree
Christopher Collins
Front End Web Development Techdegree Student 6,343 Points

Is it possible to assign the background color (grey) to the body element, or the parent div, rather than that of the <a> element?

This should allow you to adjust the width of the <a> without effecting the background color for the larger element.

John Levy
John Levy
1,451 Points
John Levy
John Levy
1,451 Points

Thanks for your reply. I thought about that but I was planning to have one line white, the second line grey back and fourth to separate the bullet points so I cant make it all the same color.