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 How to Make a Website CSS: Cascading Style Sheets Center the Wrapper

nallely kalamaco
nallely kalamaco
239 Points

What if i want my whole page to be centered including the title, body, and footer? While using external css?

Do i add <div id="wrapper"> to the head section and end it after footer? and also add #wrapper { width:800px; margin 0 auto; } to my .css page? because that does nothing... i need help.

Jake Steel
Jake Steel
5,048 Points

You could use the (*)symbol on your CSS page to designate everything on the page.

You'll start out by *{ }

1 Answer

Erick Kusnadi
Erick Kusnadi
21,615 Points

1) First make sure that you have the external CSS stylesheet correctly linked to the html. You can do a quick check by adding this at the top of the css

body{ background: orange !important; }

Refresh the html, and the whole body's background should be orange, if it is then the style sheet is correctly linked, and you can erase the above code.

2) If you want to have everything centered, similar to the styles like in the video, then you have to put everything in a div then give it the id of wrapper, but an easier way is just to give the body tag the id. body id="wrapper"

3) Then in the css you can add the wrapper styles like in the video. #wrapper{...}