2 Answers
2

The use of ul seems appropriate. My concern with using <img>s would be with the image dimensions. From what I can see above, unless you create your images specifically in those dimensions, it will become a pain to ensure they scale correctly.

I've found that if you want to preserve a predetermined width and height for your images without ruining the aspect ratio it's almost always easier to use background-image rather than <img> tags.

Using background-size: cover you can ensure that the image covers the available space, without losing the ratio:

The cover value specifies that the background image should be sized so
that it is as small as possible while ensuring that both dimensions
are greater than or equal to the corresponding size of the container

\$\begingroup\$right, well the idea was that images that are selected would be cropped down to a certain dimension to ensure that they look good at various scales.\$\endgroup\$
– JGallardoFeb 3 '14 at 17:26

1

\$\begingroup\$I think that cover will serve you better and be much simpler to implement :)\$\endgroup\$
– JivingsFeb 3 '14 at 17:29

2

\$\begingroup\$background-size: cover is specially helpful when you want to scale the image, but don't know what will be the dominant dimension. That is, if you need to scale to fit the width, or the height.\$\endgroup\$
– valsFeb 3 '14 at 18:57