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 CRYSTAL MORRIS
CRYSTAL MORRIS
Courses Plus Student 2,809 Points

borders, backgrounds and boxes

I am trying to take an entire page and put it inside of border with the background on the edges. My first question is how do you label an entire page without messing everything up???

6 Answers

James Ingmire
James Ingmire
11,901 Points

First question: Wrap it in a div e.g. '''div id="wrapper"> entire page content </div''' Style this however in css: '''#wrapper { margin: 0 auto; width: 960px;}'''

Then if you want a background image behind your content it nothing to do with borders the actual html element, make another div before the "wrapper" one above and ending after the "wrapper" one above. Set the z-index to auto or initial or 0; place an image in css, set the width etc and should work. Not sure if understood but hey might help. Let me know if so and makes sense. Good luck.

CRYSTAL MORRIS
PLUS
CRYSTAL MORRIS
Courses Plus Student 2,809 Points
CRYSTAL MORRIS
CRYSTAL MORRIS
Courses Plus Student 2,809 Points

Thais Is What I Found On CSS Page Borders, Backgrounds and Boxes I Tried This Code And Nothing Moves (it Just Turned The Page White)

<style> body { background: url("wrapper") no-repeat left top / 200px 70px scroll content-box content-box, url("wrapper") no-repeat left top / 240px 110px scroll padding-box padding-box, url("wrapper") no-repeat left top / 280px 150px scroll border-box border-box white;} </style>

CRYSTAL MORRIS
PLUS
CRYSTAL MORRIS
Courses Plus Student 2,809 Points
CRYSTAL MORRIS
CRYSTAL MORRIS
Courses Plus Student 2,809 Points

Thanks James :-)

James Ingmire
James Ingmire
11,901 Points
James Ingmire
James Ingmire
11,901 Points

Think you need to help yourself and go back to learn the section again. All of above i am afraid is wrong. Good luck tho :(

CRYSTAL MORRIS
PLUS
CRYSTAL MORRIS
Courses Plus Student 2,809 Points
CRYSTAL MORRIS
CRYSTAL MORRIS
Courses Plus Student 2,809 Points

Thanks

CRYSTAL MORRIS
PLUS
CRYSTAL MORRIS
Courses Plus Student 2,809 Points
CRYSTAL MORRIS
CRYSTAL MORRIS
Courses Plus Student 2,809 Points

This Is A Sample Of The HTML

<body> <div>This Is A Block Element</div> <p class="wrapper"> <em><h1>Dr. Maggie Wincher Music Ministries</h1></em>

</p>