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 trialDeborah Koh
2,009 PointsThe profile picture won't turn into a circular image but the code on Workspaces looks right.
I've went back and checked the videos, and it looks like everything I'm typing on my Workspaces matches with the video... yet, the circular image for the profile picture won't turn up!
Deborah Koh
2,009 PointsThis is the relevant code for main.css
/******************** PAGE: ABOUT ********************/
.profile-photo { display: block; max-width: 150px; margin: 0 auto 30px; border-radius: 100%; }
Do you need any more of the code?
2 Answers
Paul Sullivan
7,876 PointsThe html wouldn't hurt. Really just need to make sure you have it set to the class of "profile-photo". So...
<img class="profile-photo" src=" ">
Something like that, depending on the container the class is in. As for the CSS, it looks correct.
EDIT: Sorry, I misread your question. If the image is not showing up at all, double check that you have the correct src path as well as completely correct spelling as well as the correct file extension. I'd try and get your HTML posted so we can double check it. :)
Deborah Koh
2,009 PointsI added a spacing between < and img so I could post the code.
< img src="img/nick.jpg" alt="Photograph" class="profile-photo">
The image is showing, except it's not applying the CSS that I had previously posted. :(
EDIT: OMG it works! I have no idea how because I literally did not do anything and just refreshed the page just for kicks and it's circular now. Wooo, thanks for your help & time.
Paul Sullivan
7,876 PointsLol. Awesome. Glad it's working now for whatever reason. :)
Paul Sullivan
7,876 PointsFor future reference, check out the Markdown Cheatsheet just below the post box for an example of a better way to post code. :)
And... are you sure the image is actually in the folder that you are referencing?
Paul Sullivan
7,876 PointsPaul Sullivan
7,876 PointsIf you post your code, we'll be able to take a look at it and see what's going on. :)