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 Unused CSS Stages Transitions and Transforms 3D Transforms: Part 2

Stephen Dawes
Stephen Dawes
4,966 Points
Posted by Stephen Dawes
Stephen Dawes
4,966 Points

Hi - general question as im on this topic, when I use code pen, how do I view the 'background' CSS for the entire file?

basically, you mentioned there were a number of properties that you coloured the box, added shadow, border radius etc, however these do not show up in code pen, but must be somewhere, otherwise it wouldnt function? Is there anyway to view this code and play about with that, other than just the transform code?

Brent Suggs
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Brent Suggs
Front End Web Development Techdegree Graduate 21,343 Points
Brent Suggs
.a{fill-rule:evenodd;}techdegree seal-36
Brent Suggs
Front End Web Development Techdegree Graduate 21,343 Points

I would assume that since that code references images, that they have copy-writted, is the reason that that part of the code is hidden from view even in CodePen. Just a thought though

1 Answer

Wayne Priestley
Wayne Priestley
19,579 Points
Wayne Priestley
Wayne Priestley
19,579 Points

Hi Stephen,

Are you referring to a css file that you downloaded from Treehouse and then pasted into codepen?
There are no copyright issues with images or code used by the tutors, you are free to use it however you wish.

I have downloaded the project files and the code is there.

.wrap div {
    width: 100%;
    height: 100%;
    border-radius: 10px;
    background-position: 50% 50%;
    background-size: 150px;
    background-repeat: no-repeat;
    box-shadow: inset 0 0 45px rgba(255,255,255,.3), 0 12px 20px -10px rgba(0,0,0,.4);
    color: #FFF;
    text-align: center;
    text-shadow: 0 1px rgba(0,0,0,.3);
    font: bold 3em sans-serif;
    line-height: 350px;
}

This was in 3D transforms/final/page.css

Hope this helps.