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

CSS border and border radius not working

I'm trying to create the border and border radius for the place holder image, but it just doesn't work for me. I've tried on 3 different browsers and ran the code through some HTML and CSS Validators. Someone please help!

<!DOCTYPE html> <html> <head> <title>Anil Patria's Resume</title> <link rel="stylesheet" href="resume.css"> </head> <body> <img src="https://placeimg.com/200/200/tech" alt="Anil Patria, Web Developer" class="main-image"> <h1>Anil Patria, Web Developer</h1> <h2>Summary of Qualifications</h2> <uL> <li>Experience as a Freelance Web Developer</li> <li>Experience with HTML, CSS, and Javascript</li> <li>Bachelor of Science in, Economics</li> </uL> </body> </html>

body { font-family: "Arial" }

.main-image { border: solid 4px black; border-radius: 50%; }

3 Answers

Thanks Mindaugas, that worked straight away and gave me the border. Appreciate the help :)

I tried your code and it appears to work in Chrome, Firefox, and Safari. What is it you see where it doesn't work? Is the image not inside a circle?

Thanks for your quick response Kris.

Yeah the image is not appearing as a circle or with the border radius. I know the css sheet is linked correctly because I managed to change the fonts perfectly fine, but the image just won't move to a damn circle with a border!