Reply To: Client Showcase/Gallery Design – CSS Only

[Beverleyh]

I’m not sure what trouble you’re having but you can normally find example layouts if you type a query into google: “grid of image css layout” for example, and start your research there.

You could also look into different type of layouts:
– float layouts
– flex layouts
– grid layouts

Interactions (click/tap/drag the screen = something happens) are normally performed with JavaScript, although you can do some things with CSS using the “checkbox hack”, and the :target selector, or even with :hover (albeit v basic and not great for cross-compatibility/usability on touch devices). Again, try googling those: “interactions with checkbox hack”, etc.

For animations, look into “CSS animations and keyframes”. You could then trigger an animation using the checkbox hack, for example.

Once you’ve done some research, if you hit a specific problem, feel free to post a simple CodePen demo and we can offer suggestions on how to fix the issue. Broad questions are unfortunately too difficult to answer effectively, so you’ll likely receive broad answers (like above).