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 trialMuhammad Rizwan
8,595 PointsFinally, use the shorthand notation to shorten the border-radius value down to two units.
I wish it could be better question.
/* Complete the challenge by writing CSS below */
.wildlife {
border-radius: 20px 5px 20px 5px;
}
<!DOCTYPE html>
<html>
<head>
<title>Lake Tahoe</title>
<link rel="stylesheet" href="page.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="primary-content">
<div class="wildlife">
<h2>Check out all the Wildlife</h2>
<p>
As spawning season approaches, the fish acquire a humpback and protuberant jaw. After spawning, they die and their carcasses provide a feast for gatherings of <a href="#mink">mink</a>, <a href="#bears">bears</a>, and <a href="#eagles">bald eagles</a>.
</p>
</div><!-- End .wildlife -->
</div><!-- End .primary-content -->
</body>
</html>
8 Answers
Ken Alger
Treehouse TeacherMuhammad;
Simply remove one set of 20px 5px
from the code and it will function the same. Remember for border-radius
the four values for each radii are given in the order top-left, top-right, bottom-right, bottom-left. If bottom-left is omitted it is the same as top-right. If bottom-right is omitted it is the same as top-left. If top-right is omitted it is the same as top-left.
Hope it helps,
Ken
Brett Bell
15,813 PointsJust wanted to add my feedback that the language for the challenge needs to be adjusted. Like others, I did not understand reducing the value by "two units".
mikes02
Courses Plus Student 16,968 Points.wildlife {
border-radius: 20px 5px;
}
In this shorthand, 20px represents top left and bottom right radius, and 5px represents top right and bottom left radius. Is that what you're looking for?
James Marchant
6,963 PointsI was very confused by the phrasing of this. I think the "Two units" should be written as "Two values" because I was trying to shorten the actual radius down by two pixel units not the CSS statement down to two values.
Alan Coggins
5,436 PointsThis is a badly written challenge. I actually used the shorthand notation in the first step and it was marked correct. I then had no idea what they were asking for in the second question ... two units? ... is that 2 pixels, 2 em, 2 elephants???
Yosef Ali
15,182 PointsThanks! Daniel
James Gill
Courses Plus Student 34,936 PointsMuhammad,
Here's another detail:
It's fairly simple once you see it, but you may encounter a common problem--a nitpicky Challenge code window. For example, I entered correct CSS but kept getting error messages--until I cut-and-pasted it from elsewhere and submitted it several times. Suddenly, it passed. I've encountered this in several code challenges, especially the Python courses.
kheiferfuller
8,635 PointsI spent way too long staring at this. I like every one above was so lost. I even went ahead and tried scaling down the the radii. Luckily I decided to just search for it.
VIVIAN CENTENO
2,335 PointsVIVIAN CENTENO
2,335 Points.wildlife { border-radius: 20px 5px 20px 5px;
}
YOUR CODE border-radius: top right bottom left; or SHORTHAND border-radius: 20px 5px;
border-radius: top&bottompx R&Lpx;