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

HTML How to Make a Website Adding Pages to a Website Style New Pages

Posted by Carl Baker
Carl Baker
2,491 Points

when I put the "display: block;" in for the about page my photo gets pushed to the right of my header. what is going on?

this is while Im putting it in my css. I can erase it and it comes back to the center under my header. Why is this giving me a problem but it doesn't happen for nick?

Jose Fremaint
Jose Fremaint
2,885 Points
Jose Fremaint
Jose Fremaint
2,885 Points

Add the code here if you can, so i can help you.

7 Answers

Carl Baker
Carl Baker
2,491 Points

So basicly I was using Firefox and changed my browser to chrome and everything looks right thanks Blair

Blair Rorani
Blair Rorani
6,658 Points
Blair Rorani
Blair Rorani
6,658 Points

Copy and paste the html and the css for the photo (.profile-photo ?) then we can see what your code is telling the browser to do and where you might need to make a change.

Carl Baker
Carl Baker
2,491 Points
Carl Baker
Carl Baker
2,491 Points

.profile-photo { display: block; max-width: 150px; margin: 0 auto 30px; border-radius: 20px;

}

Blair Rorani
Blair Rorani
6,658 Points
Blair Rorani
Blair Rorani
6,658 Points 
<div id="wrapper">
      <section> 
        <img src="img/Me.jpg" alt="Photograph of Carl Baker" class="profile-photo">
        <h3>About</h3>
        <p>Hi, I'M Carl Baker. This is my first webpage Ive made, where you can come see my new designs and updated work. When I'm not writing code I enjoy hashing with all my friends, playing xbox 360, and drinking local craft brews and making moonshine.</p>
        <p>If you'd like to follow me on twitter, my user name is <a href="http://twitter.com/SOFTheDuke">@SOFTheduke</a>.</p>
      </section>
      <footer>
          <a href="http://twitter.com/SOFTheDuke"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a>
          <a href="https://www.facebook.com/carl.baker.58"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a>
        <p>&copy; 2014 Carl Baker.</p>
      </footer>
    </div>

I ran this code in my browser and it displays the profile photo centred as shown in the video.

Carl Baker
Carl Baker
2,491 Points
Carl Baker
Carl Baker
2,491 Points

its giving me issues, it wont let me post it <section> <img src="img/Me.jpg" alt="Photograph of Carl Baker" class="profile-photo"> <h3>About</h3>

Carl Baker
Carl Baker
2,491 Points
Carl Baker
Carl Baker
2,491 Points

the "about" is part of it but its the only piece that comes up

Carl Baker
Carl Baker
2,491 Points
Carl Baker
Carl Baker
2,491 Points

ok

Carl Baker
Carl Baker
2,491 Points
Carl Baker
Carl Baker
2,491 Points

was not working in firefox, but once I opened in google chrome it came up fine