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

Design

Posted by Ghislain Inai
Ghislain Inai
1,515 Points

On the Project how-to-make-a-website

Hello Friends, I would be happy if someone can solve this problem for me. Actually on the project "how to make a website" there is a page of about. I would like to use that page for more than one person on the page; how can I do that? so that I have one person on the top of another? Copying the section seems not to work with me. Thank you

3 Answers

Vladimir Dumitraskovic
Vladimir Dumitraskovic
24,195 Points

Hi, Inai! Yes, You could use project files (about.html) to add more than one person on the page. All You need to do is copy everything between and including section tags:

 <section>
        <img src="img/nick.jpg" alt="Photograph of Nick Pettit" class="profile-photo">
        <h3>About</h3>
        <p>Hi, I'm Nick Pettit! This is my design portfolio where I share all of my favroite work. When I'm not designing things, I enjoy exercising, playing video games, drinking good coffee, and more.</p>
        <p>If you'd like to follow me on Twitter, my username is <a href="http://twitter.com/nickrp">@nickrp</a>.</p>
</section>

Just change image src, header, and all the rest. If you need more help, don't be shy to ask.

Andrew Lawrence
PLUS
Andrew Lawrence
Courses Plus Student 3,824 Points
Andrew Lawrence
Andrew Lawrence
Courses Plus Student 3,824 Points

Hi Ghislain,

I'd be happy to help you, but could you maybe post some code that you're stuck on? What code are you writing and what behavior are you expecting it to have?

It sounds like maybe you would like to visually represent more than one person's information on the about page? Is that right?

Ghislain Inai
Ghislain Inai
1,515 Points
Ghislain Inai
Ghislain Inai
1,515 Points

Hello Vladmir and Andrew, thank you for your responses. I should maybe follow the video again. I thought I had the code properly done but it does not show so. The second <section> appears in the browser with a bigger margin on the left. Here is the css in responsive:

.profile-photo { float: left; margin: 0 5% 80% 0; }

on the other stylesheet it is as follows:

.profile-photo { display: block; max-width: 200px; margin: 0 auto 30px; border-radius: 100%; }