When responsive to smaller sized screens-photos expand too much

[sandyms]

How can I have the photos not expand and get so large and fuzzy on smaller-sized screens?

The set image size for these photos of the council is 152 w x 182 h.

---

[Support]

Hello,

This is because your images are too small in pixels.

You have two options:

1) Have bigger images, probably the best is a minimum of 600px of width.

or

2) Change the layout to show two columns on mobile screen. For it change the HTML of each member to:

<div class="col-6 col-md-3 col-sm-4 col-xs-4 isotope-item..........

* Note col-6.

Also add the custom CSS code below at (css/custom.css):

@media (max-width: 991px) and (min-width: 576px) {
    .isotope-item {
        max-width: 33.3%;
    }
}

@media (max-width: 575px) {
    .isotope-item.col-6 {
        max-width: 50%;
    }
}

We hope this helps!

Please try that and let us know if you need further assistance.

Kind Regards,

Rodrigo.

If you are satisfied with Porto HTML and our support, please leave your comment and rating on ThemeForest downloads page. That helps us a lot: https://themeforest.net/downloads

---

[sandyms]

Perfect. Thank you! This worked! I appreciate your help!!

Have a nice day,

---

[Support]

Hello,

Great! 🙂

If you need further assistance feel free to contact us.

Kind Regards,

Rodrigo.

---

If you are satisfied with Porto HTML and our support, please leave your comment and rating on ThemeForest downloads page. That helps us a lot: https://themeforest.net/downloads

---

[Author]

Posts