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 Nas Jones
Nas Jones
7,849 Points

Bottom border help

https://w.trhou.se/oj29fstt12 .. This is the example project guil used, If you notice to create breaks of a section he applied a bottom border to each one. When I try to do that in my project the bottom border takes up the whole width of the page unlike his. I could use a <hr> in html but I feel like i want to know how he specifically did it and why it wont work for me?. Also, I know basic html and css so advanced code or words i wont understand, so please try and make it simple and easy for me. https://w.trhou.se/xbb4ilaula .. That is my example project i'm doing also.

1 Answer

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,253 Points
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,253 Points

It looks like the HTML code you have used is a different structure to that which Guil used in his example.

In Guil's Lake Tahoe example, he's applied a width to the .secondary-content class where he's given it a width of 960px and applied automatic margins to it so the browser is pushing to the center of the element.

But you can make it work in your example to make it look like Guils.

In your CSS, remove the width property from your universal selector.

* {
    box-sizing: border-box;
    /* width: 960px; */
}

And apply the following CSS to the element with the ID of #list.

div#list {
    margin: auto;
    width: 960px;
}

This does the same thing as what Guil did. It applies automatical margins on all sides of the element, pushing the element towards the sentence and gives it the same fixed width.

Nas Jones
Nas Jones
7,849 Points

Thanks for the help it fixed the issue