Reputation: 423
I have been tasked with making an update to the following site:
I would like it to allow an infinite number of images to appear horizontally in each category. You will see right now that the width is hard set in the CSS, which isn't ideal as the image will start tiling underneath each other if they reach that width.
Any tips on how I can modify the CSS to allow for this?
Thanks.
Upvotes: 0
Views: 1687
Reputation: 3243
There is a jquery solution I have created, which allows you to add as many images as you like, and it will adjust the width of the image container dynamically. See here - http://codepen.io/lukeocom/pen/zovbe
For a CSS only solution, you would create a container for the image container. The image container would be auto width, the outer container would have overflow-x set to auto. This css can be viewed in the above demo too.
hope this helps
Upvotes: 1
Reputation: 16719
Set
white-space: nowrap;
on the image container element. Also add display: inline-block;
to your images if you didn't already (or inline
).
You should consider using some kind of slider script. People don't like horizontal scrollbars
Upvotes: 1