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 Maximino Cosme
Maximino Cosme
1,287 Points

A bit of help with this responsive design?

Hello all,

I'm trying to help my friend out with a little problem they're running into, but I'm not skilled enough to tackle it yet. Her website is http://ranjanigroth.com and her concern is with the image strip on the main page.

She wants to have something to the effect of the following example: http://www.prophoto.com/store/jack-jill/

In the above example, when you change the dimensions of the page, pieces of previously hidden images appear on either side of the center three.

How would she be best able to replicate something like this? Any and all help is appreciated.

Thank you.

2 Answers

Ryan Field
PLUS
Ryan Field
Courses Plus Student 21,242 Points
Ryan Field
Ryan Field
Courses Plus Student 21,242 Points

I'm unsure what your question is. Neither of the websites that you linked to are responsive, so is it just the overall design and format that you/she are trying to replicate?

Ryan Field
Ryan Field
Courses Plus Student 21,242 Points
Ryan Field
Ryan Field
Courses Plus Student 21,242 Points

Oh, I think I get what you're saying now. I have a larger screen, so I see those side images by default. I don't think this is responsive as much as it is simply using a wider background than the main image gallery, which, by default, will show as long as the screen has a wider size than it. I haven't been able to pinpoint yet where the image is coming from, though.

Edit: Aha, found it! As I suspected, it's just a really wide image that is used as background-image for the body of the document.

Maximino Cosme
Maximino Cosme
1,287 Points
Maximino Cosme
Maximino Cosme
1,287 Points

I went with my gut and assumed it was responsive. Maybe I just don't know what that means. haha. In time, I'm sure.

But thanks for the help! I think I'll be able to reproduce something similar now. =)