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.

HTML How to Make a Website Adding Pages to a Website Make an About Page

select an image and set it to be a block element

I have done all the suggested advise and it still gives me the error that have you set the profile image property to be blocked. Now I am wondering if I am putting it in the right place?????

<section> <img src="img/gratt.png" alt="nick.jpg" class="profile-photo"> <p> nick likes to experiment with color and texture </p> img { display: block; } </section>

Christopher Carrasco
Christopher Carrasco
20,679 Points

To select an img element with the syntax you are using, it should be between a style tag and placed inside the head element like so.

         <head>
              <style>
                   img { display: block;}
               </style>
         <head>
         <body>
             <img src="img/gratt.png" alt="nick.jpg" class="profile-photo">
             <p> nick likes to experiment with color and texture </p>
         </body>

Since the img has a class you could also set the img block referencing it's class name using a dot before the class name 'profile-photo'.

         <head>
              <style>
                   .profile-photo { display: block;}
               </style>
         <head>
         <body>
             <img src="img/gratt.png" alt="nick.jpg" class="profile-photo">
             <p> nick likes to experiment with color and texture </p>
         </body>

Lastly you could style the img inline within the html img tag (Not a good practice doing it this way, but does get the job done)

         <body>
             <img src="img/gratt.png" alt="nick.jpg" class="profile-photo" style="block;">
             <p> nick likes to experiment with color and texture </p>
         </body>

Hope you get it working.

3 Answers

There should be a second tab at the top, labeled CSS/Main.css. That is where you would put your CSS.

here is what I put in the second tab of CSS and I still got the error. What on earth am I doing wrong!!!!!! Here is my code.

nav li { img { display: block; }

It is under the nav li {. I have been working on this since my time 6:00 AM and it is 10:41 AM my time now.

You shouldn't have to call the nav li. You'll want your CSS to look like this:

img {
display: block;
} 

This is because the 'img' selector is specific enough for the browser to know what to apply the style to.

Woooohoooo!!!!!!!! Thank you Melisa!!!!!! I was in the wrong spot and you sent me to the right spot. you are the bomb!!! thanks a bunch. I knew something had to be wrong. I new I had the code right but something just wasn't working. I tried several places.

Hurray!!! Your welcome! I'm so glad you were able to figure it out! It's so frustrating when you know your on the right track, but not sure what your doing wrong.

Been there, done that. lol