Title: Responsive thumbnails
Last modified: August 22, 2016

---

# Responsive thumbnails

 *  [tdtdtt](https://wordpress.org/support/users/tdtdtt/)
 * (@tdtdtt)
 * [11 years, 3 months ago](https://wordpress.org/support/topic/reponsive-thumbnails/)
 * Hi,
 * I would like the thumbnail size to be set based on the browser window so that
   if i have a row of 3 images, these 3 images always stay on the same row but scale
   down to fit. Is this possible to do? Is there an additional plugin that I need?
 * I tried adding the following code to my css as suggested in a previous post but
   this locked the height of the thumbnails and only altered the width meaning i
   had 2 cropped images to the left and one non-cropped image to the right
 *     ```
       .ngg-gallery-thumbnail-box {
       	float: left;
       	width: 30%;
       }
       ```
   
 * Would appreciate any advice,
    Thank you!
 * [https://wordpress.org/plugins/nextgen-gallery/](https://wordpress.org/plugins/nextgen-gallery/)

Viewing 3 replies - 1 through 3 (of 3 total)

 *  Plugin Contributor [photocrati](https://wordpress.org/support/users/photocrati/)
 * (@photocrati)
 * [11 years, 3 months ago](https://wordpress.org/support/topic/reponsive-thumbnails/#post-5878283)
 * [@tdtdtt](https://wordpress.org/support/users/tdtdtt/) – If you want to add custom
   CSS that only works in small viewport sizes then you will likely also need to
   ensure you are using the appropriate media queries as well in your CSS definitions.
 * Thanks!
 * – Cais.
 *  Thread Starter [tdtdtt](https://wordpress.org/support/users/tdtdtt/)
 * (@tdtdtt)
 * [11 years, 3 months ago](https://wordpress.org/support/topic/reponsive-thumbnails/#post-5878382)
 * Hi Cais,
 * Thank you but could you explain what you mean in a bit more depth?
 * I’m now trying to use the following code which works on a typical image
 *     ```
       .ngg-gallery-thumbnail-box {
           float: left;
           width: 30%;
           max-width:360px;
           height:auto;
       }
       ```
   
 * This still has no effect on the height, i want the height and width to scale 
   down relative to the browser window size. It seems there must be another rule
   overwriting mine but I can’t work out where this is?
 *  Plugin Contributor [photocrati](https://wordpress.org/support/users/photocrati/)
 * (@photocrati)
 * [11 years, 3 months ago](https://wordpress.org/support/topic/reponsive-thumbnails/#post-5878387)
 * [@tdtdtt](https://wordpress.org/support/users/tdtdtt/) – You can search on “CSS
   Media Queries” and get links like this:
 * – [https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries](https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries)
   –
   [http://www.w3schools.com/cssref/css3_pr_mediaquery.asp](http://www.w3schools.com/cssref/css3_pr_mediaquery.asp)
 * Those should get you started.
 * – Cais.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Responsive thumbnails’ is closed to new replies.

 * ![](https://ps.w.org/nextgen-gallery/assets/icon-256x256.png?rev=2083961)
 * [Photo Gallery, Sliders, Proofing and Themes - NextGEN Gallery](https://wordpress.org/plugins/nextgen-gallery/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/nextgen-gallery/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/nextgen-gallery/)
 * [Active Topics](https://wordpress.org/support/plugin/nextgen-gallery/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/nextgen-gallery/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/nextgen-gallery/reviews/)

## Tags

 * [gallery](https://wordpress.org/support/topic-tag/gallery/)
 * [nextgen](https://wordpress.org/support/topic-tag/nextgen/)
 * [Scale](https://wordpress.org/support/topic-tag/scale/)
 * [thumbnails](https://wordpress.org/support/topic-tag/thumbnails/)

 * 3 replies
 * 2 participants
 * Last reply from: [photocrati](https://wordpress.org/support/users/photocrati/)
 * Last activity: [11 years, 3 months ago](https://wordpress.org/support/topic/reponsive-thumbnails/#post-5878387)
 * Status: not a support question