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 Create a Fullscreen Slider with CSS

Posted by Scott Hofmann
Scott Hofmann
1,733 Points

How might one go about making this carousel slider contain 3 columns of images instead of only one?

I'd like to be able to show three images within the slider <1,2,3> instead of only one image <1> that takes up the whole space. How might one modify this code to make that happen?

1 Answer

Austin Whipple
Austin Whipple
29,725 Points
Austin Whipple
Austin Whipple
29,725 Points

You could probably adjust to accommodate three images per slide:

  1. Take the background off of the .slide element.
  2. In the HTML, add three div elements.
  3. Add some CSS to those interior divs to give them height:100%;, width: 33%, and background images.