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 How to Make a Website Adding Pages to a Website Style New Pages

Posted by nicolai kristensen
nicolai kristensen
2,316 Points

My css, (.profile-photo {}) wont target my img with profile photo, so when i edit the css it doesnt change anything.

I used the class="PRO" and when i turn in to style it with the, .profile-photo it doesnt change anything on the webpage (doesnt make it round) It basically doesnt apply the css i styled it with

This is how it looks in coding CSS: .PRO { display: block; max-width: 150px; margin: 0 auto 30px; border-radius: 100%; }

HTML: <section> <img src="img/nick.jpg" alt="Twitter Logo" class="PRO"> <h3>About</h3> <p>Hi, I'm Nicolai Kristensen im a noob at designing shit, and this is where i tell some shit about me. When im not designing shit websites i use my time playing computer. LIFE IS COMPUTER</p> <p>if you'd like to follow me on twitter my username is <a href="http://twitter.com/nickrp">@sutminpik</a></p> </section>

Juan Trujillo
Juan Trujillo
9,391 Points
Juan Trujillo
Juan Trujillo
9,391 Points

It would be difficult to tell without looking at your entire html and css code. I would recommend starting off by making sure that ALL of your CSS declarations in your main.css file are opened and closed properly with curly braces.

2 Answers

Codin - Codesmite
Codin - Codesmite
8,600 Points
Codin - Codesmite
Codin - Codesmite
8,600 Points

The code works correctly for me.

HTML:

<img src="img/nick.jpg" alt="Twitter Logo" class="PRO">

CSS:

.PRO{
  display: block;
  max-width: 150px;
  margin: 0 auto 30px; 
  border-radius: 100%; 
}

What browser and version are you using? border-radius isn't compatible with some older browser versions, specifically Internet Explorer that didn't become fully compatible with it untill version 9.

http://caniuse.com/#feat=border-radius

I have made a codepen of your code using another image and it doesn't show any problems for me (I am using Firefox V39 and Chrome V44)

http://codepen.io/anon/pen/bNmLBJ

Hope this helps :)

nicolai kristensen
nicolai kristensen
2,316 Points
nicolai kristensen
nicolai kristensen
2,316 Points

Thanks for your input guys, i like how fast it is to get help here!..

I solved the problem myself and i found it being a dumb mistake...

the reason was that i had already made an contact.html where there was some coding that was blocking it from working the correct way!

Thanks though!!