Scale image to fit column width

Support
#1

I have a two column row and each column I have placed an image element in it and when I resize the browser window really large the image stops scaling and leaves a gap.

See attached screenshot

How can I adjust these images so they constantly scale no matter how large the browser window gets?

Thanks.

#2

Hi,

Try to set your image width to 100%

or if you are using classic image element, you can add it in the style field.

#3

I already have it set to that. I think what is happening is that the image is only 900px wide and when it reaches that size instead of continuing to scale it just stops?

I have even used the inline style min-width: 100%; and it still won’t work.

#4

Hi,

Can you provide us your site url so we can take a closer look.

Thanks

#5

http://www.scottvarga.com/haptx/

I can give you a login if needed

#6

Hi,

Would you mind providing us with login credentials so we can take a closer look? Please provide following information:

Set it as Secure Note

  • Link to your site
  • WordPress Admin username / password

All the best!

#7

just sent it in a secure note

#8

Hi,

The login provided doesn’t seem to work.

Kindly check again.

Thanks

#9

Sorry, hold on

#10

Hi,

I went ahead and added a class to that section

then added this in Global CSS


.my-images .x-image img {
    width:100% !important;  
}

Please clear your browser cache before checking the page

http://www.scottvarga.com/haptx/

Thanks

#11

Thanks! It works perfectly!

#12

So I added that class to the section at the bottom with the four images but only the first two seem to be following it. The last two don’t?

#13

I fixed it.

Thanks again!

#14

You’re welcome! :slight_smile:

#15

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.