Title: Responsive images
Last modified: August 31, 2016

---

# Responsive images

 *  Resolved [mc64](https://wordpress.org/support/users/mc64/)
 * (@mc64)
 * [9 years, 12 months ago](https://wordpress.org/support/topic/responsive-images-25/)
 * Hi,
 * would it be possible to add something like “height: 14vw;width: 14vw;” to the
   sola_t_image sola-t-round-image classes instead of fixed pixels? I am strugling
   with too small images on big screens and/or overlapping images on small mobile
   phones.
 * And thank you for this really useful plugin!
 * Michele
 * [https://wordpress.org/plugins/sola-testimonials/](https://wordpress.org/plugins/sola-testimonials/)

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

 *  Plugin Author [SolaPlugins](https://wordpress.org/support/users/solaplugins/)
 * (@solaplugins)
 * [9 years, 12 months ago](https://wordpress.org/support/topic/responsive-images-25/#post-7383199)
 * Hi Michele.
 * Thank you for your kind words!
 * You could do this by going to ‘Testimonials’ -> ‘Settings’ and adding the following
   CSS to the ‘Custom CSS’ field:
 *     ```
       .sola_t_image .sola-t-round-image{
         height: 14vw;
         width: 14vw;
       }
       ```
   
 * Does this help at all?
 *  Thread Starter [mc64](https://wordpress.org/support/users/mc64/)
 * (@mc64)
 * [9 years, 12 months ago](https://wordpress.org/support/topic/responsive-images-25/#post-7383206)
 * Thanks for your quick reply!
 * That’s what I tried, it works when I put it in Firebug but th customcss field
   returns excamation marks and “expected (<length>|<percentage>|auto|inherit) but
   found ’14vw'” and when I try something like `height: 22%;width: auto;` it has
   no effect.
 *  Plugin Author [SolaPlugins](https://wordpress.org/support/users/solaplugins/)
 * (@solaplugins)
 * [9 years, 12 months ago](https://wordpress.org/support/topic/responsive-images-25/#post-7383208)
 * Hi there.
 * Sorry about that. Would you mind trying the following:
 *     ```
       .sola_t_image .sola-t-round-image{
         height: 14vh;
         width: 14vw;
       }
       ```
   
 * If the above doesn’t help, we might need to disable the JavaScript class used
   to resize the images.
 *  Thread Starter [mc64](https://wordpress.org/support/users/mc64/)
 * (@mc64)
 * [9 years, 12 months ago](https://wordpress.org/support/topic/responsive-images-25/#post-7383209)
 * same thing, it shows only the default image size.
    but perhaps my approach was
   completely wrong? are the images meant to shrink dependent on the viewport size?
 *  Plugin Author [SolaPlugins](https://wordpress.org/support/users/solaplugins/)
 * (@solaplugins)
 * [9 years, 12 months ago](https://wordpress.org/support/topic/responsive-images-25/#post-7383210)
 * Hi there.
 * Would you mind sending me a link to one of the pages on your site with the testimonials
   on it so that I can look into this for you?
 * The image should resize/scale according to the viewport as they are response (
   they’ll be smaller on a mobile device than on a desktop) – but I’d like to just
   try it on your website to see what you are experiencing.
 *  Thread Starter [mc64](https://wordpress.org/support/users/mc64/)
 * (@mc64)
 * [9 years, 12 months ago](https://wordpress.org/support/topic/responsive-images-25/#post-7383211)
 * sure:[pyar.de](http://wp.pyar.de/)
    it’s a work in progress, so be gentle 🙂
 *  Plugin Author [SolaPlugins](https://wordpress.org/support/users/solaplugins/)
 * (@solaplugins)
 * [9 years, 12 months ago](https://wordpress.org/support/topic/responsive-images-25/#post-7383218)
 * Hi there.
 * I see what you mean now. Ideally you’d want less items in a row as the window
   scales to a smaller width – would you be okay with this? That way enough space
   will be available between the images and they won’t overlap.
 *  Thread Starter [mc64](https://wordpress.org/support/users/mc64/)
 * (@mc64)
 * [9 years, 12 months ago](https://wordpress.org/support/topic/responsive-images-25/#post-7383231)
 * That would be perfect, thank you so much!
    Do I have to change something?
 *  Plugin Author [SolaPlugins](https://wordpress.org/support/users/solaplugins/)
 * (@solaplugins)
 * [9 years, 11 months ago](https://wordpress.org/support/topic/responsive-images-25/#post-7383258)
 * Hi there.
 * Please try the following CSS:
 *     ```
       @media screen and (max-width: 720px) {
           .sola_t_layout_4_container {
              width: 30%;
           }
       }
   
       @media screen and (min-width: 480px) {
           .sola_t_layout_4_container {
              width: 46%;
           }
       }
       ```
   
 * Does this help?
 *  Thread Starter [mc64](https://wordpress.org/support/users/mc64/)
 * (@mc64)
 * [9 years, 11 months ago](https://wordpress.org/support/topic/responsive-images-25/#post-7383259)
 * Thanks,
 * it works partially, but the idea was to either resize the pictures according 
   to the screen size or reduce the columns.
 * And since the image size is still a fixed value they don’t change on smaller 
   screens.
 *  Thread Starter [mc64](https://wordpress.org/support/users/mc64/)
 * (@mc64)
 * [9 years, 11 months ago](https://wordpress.org/support/topic/responsive-images-25/#post-7383260)
 * This does work:
 *     ```
       `@media screen and (min-width: 720px) {
           .sola_t_layout_4_container {
              width: 22%;
           }
       }
       @media screen and (min-width: 480px) and (max-width: 720px) {
           .sola_t_layout_4_container {
              width: 30%;
           }
       }
       @media screen and (max-width: 480px) {
           .sola_t_layout_4_container {
              width: 100%;
           }
       }`
       ```
   
 *  Plugin Author [SolaPlugins](https://wordpress.org/support/users/solaplugins/)
 * (@solaplugins)
 * [9 years, 11 months ago](https://wordpress.org/support/topic/responsive-images-25/#post-7383281)
 * Hi there.
 * So glad to hear you’ve got it working now. We’re going to add additional CSS 
   to the plugin for different viewport sizes – sorry about this.

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

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

 * ![](https://ps.w.org/sola-testimonials/assets/icon-256x256.png?rev=3524972)
 * [Super Testimonials](https://wordpress.org/plugins/sola-testimonials/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/sola-testimonials/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/sola-testimonials/)
 * [Active Topics](https://wordpress.org/support/plugin/sola-testimonials/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/sola-testimonials/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/sola-testimonials/reviews/)

 * 12 replies
 * 2 participants
 * Last reply from: [SolaPlugins](https://wordpress.org/support/users/solaplugins/)
 * Last activity: [9 years, 11 months ago](https://wordpress.org/support/topic/responsive-images-25/#post-7383281)
 * Status: resolved