Equal Height for Thumbnails in Mobile Album List
Hello,
I have another display question for the mobile version of our site -- currently, the thumbnails for our album list are all 900 pixels tall, but some are 1600 pixels wide and some are 3200 wide. On the desktop site, this works well in the column view because everything is the same height and their widths are multiples of each other, so everything stacks up nicely.
However, on the single-column display of the mobile site, the thumbnails are being re-sized to show the full width of the image, making the 3200x900 thumbnails half as tall as the 1600x900 thumbnails. This makes the album list look uneven in the column display. Is there a way to have the mobile site preserve the even height instead? It is okay if this crops the 3200px-wide thumbnails, as long as they are all the same height.
Album list: http://possibleproductions.com/genre/works/
[In the attached image of the mobile site, the "Billboard" thumbnail is normally 1600x900pixels and the "Coachella" thumbnail is normally 3200x900. Because it is being re-sized to preserve the full width, the "Coachella" thumbnail is only half as tall as the "Billboard" thumbnail.]
Thank you for your help!
I have another display question for the mobile version of our site -- currently, the thumbnails for our album list are all 900 pixels tall, but some are 1600 pixels wide and some are 3200 wide. On the desktop site, this works well in the column view because everything is the same height and their widths are multiples of each other, so everything stacks up nicely.
However, on the single-column display of the mobile site, the thumbnails are being re-sized to show the full width of the image, making the 3200x900 thumbnails half as tall as the 1600x900 thumbnails. This makes the album list look uneven in the column display. Is there a way to have the mobile site preserve the even height instead? It is okay if this crops the 3200px-wide thumbnails, as long as they are all the same height.
Album list: http://possibleproductions.com/genre/works/
[In the attached image of the mobile site, the "Billboard" thumbnail is normally 1600x900pixels and the "Coachella" thumbnail is normally 3200x900. Because it is being re-sized to preserve the full width, the "Coachella" thumbnail is only half as tall as the "Billboard" thumbnail.]
Thank you for your help!
Howdy, Stranger!
It looks like you're new here. If you want to get involved, click one of these buttons!
Comments
I don't see any easy solution for this case. Everything is fluid there, and depends on height of images. When you mess with height of images then bad thing s happen ;-)
I think these are limitation of method that we used for this layout. To achieve what you need we would have to write it differently but then you would lose some benefits in other places. Just as in life - you can choose one way at the time ;-)
With kind regards.