Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.


OK I'm having difficulty with setting border radius. No matter what % I put, save and refresh still won't change. What?

Following Nick Pettit on web development. On about page for picture setting the radius in css. I have tried to alter it with many different percentages still no change. The coding is identical. What to do /

Snapshot http:w.trhou.se/pc6oibmkbz

18,798 Points

It would help if we could see your code. Could you post a snapshot of your workspace? You can do this using the camera icon in the top right of your workspace. Post the resulting link here, and we'll be able to take a look!

I would also try closing all windows and reopening fresh, it's possible it's just a preview issue.

Christopher Denny
Christopher Denny
10,460 Points

A few things I would double check: 1) Ensure that you've saved your file before reloading the page (can't tell you how often I forget) 2) Make other drastic changes to that CSS selector to make sure that you have it properly selected 3) As for percentages in border radius, once you go beyond 50%, everything looks the same.

Best of luck to you, if those don't help, once you've posted your code, I can take a look at what else could be effecting it.


1 Answer

18,798 Points

You can declare multiple classes on a single element, which is what is happening in your code now.

// You want there to be a hyphen between profile and photo, profile-photo. 
// Otherwise, it has two separate classes, profile and photo.
<img src="img/nick.jpg" alt="Photograph of Nick Pettit" class="profile photo">

Unrelated, you'll soon find that your profile-photo will seemingly disappear. It's actually over to the right, but if you add clear: both to your profile-photo styles, it will move back to where it should be.

// Add the following line to your .profile-photo styles as well, to fix a float issue that will show up.
.profile-photo {
  display: block;
  clear: both;  // Add this line here!  <--
  max-width: 150px;
  margin: 0 auto 30px;
  border-radius: 100%;