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

HTML Build a Simple Website Styling Content Writing CSS

Posted by scottcomboni
scottcomboni
1,743 Points

Failing Check on CSS Challenge Task 2

Again on the .btn class, add 40 pixels of margin to the top and bottom. The margin on the left and right should be 0 pixels.

.btn { color: #faf3bc; background: #4fb69f url('img/texture.png') no-repeat; border-radius: 25px; text-transform: uppercase; text-decoration: none; padding-top:40px; padding-bottom:40px; padding-left:0px; padding-right:0px; }

What am I missing that this fails?

Adam Sackfield
Adam Sackfield
Courses Plus Student 19,663 Points

Try using the shorthand for the margin like so 

.btn { margin: 40px 0; } // The first number will set top and bottom the second left and right.
scottcomboni
scottcomboni
1,743 Points

See what all this snow has done.. Need more coffee apparently I cannot follow directions. Read margin but continued to set padding : Thanks for the quick response Adam.

Sc

Adam Sackfield
Adam Sackfield
Courses Plus Student 19,663 Points

Haha guess you in the USA with the snow. Used to the cold weather here in Manchester. No worries i miss things all the time as i read by scanning.

3 Answers

James Maddox
James Maddox
17,154 Points
James Maddox
James Maddox
17,154 Points

You are using padding in your code instead of margin. There's two ways to accomplish this.

Method 1. .btn { margin: 40px 0 40px 0; }

Meaning: top, right, bottom, left.

Method 2.

.btn { margin: 40px 0; }

Meaning: top/bottom and left/right.

Adam Sackfield
Adam Sackfield
Courses Plus Student 19,663 Points

He already realized this ^^^above :)

James Maddox
James Maddox
17,154 Points
James Maddox
James Maddox
17,154 Points

Cool.

scottcomboni
scottcomboni
1,743 Points
scottcomboni
scottcomboni
1,743 Points

Yes misread the entire thing.. Thanks