Extra vertical background lines between images and border on some but not all computers.

[KCMiller401]

A site I am building is showing awkward vertical lines on larger screens. The problem is worst on this page: http://kidstrongphysicaltherapy.com/home/conditions/ . I cannot see the issue on any computers or devices that I have (even if I zoom in), but the business owner’s macbook pro, her son’s computer and several others show these lines. So far we have only found it on larger screens, but that even includes the macbook pro which is not huge. Choice of browser does not make a difference. The problem lines are the ones in the screenshot below that are to the right of all of the pictures but inside the blue border. Can you figure out what is causing them and how I can get rid of them? Installing larger versions of the pictures did not help. Thanks so much.

[scrambler]

Are you speaking about the white space right of all the images?

if so, it s indeed because your images are set to be 350px wide  like the one below
http://kidstrongphysicaltherapy.com/wp-content/uploads/2017/02/Kidstrong10med.jpg
so when the browser is large, it creates dead space. If you reduce your browser size, you will se that the space will shrink and be eliminated when the columns that contain the mage become 350px or narrower.

You appear to be using a plugin “jetpack” to make your image containers, you need to check how to select the larger version of your images for them.
If you are using WordPress “Add Media” button, then you have the choice to use small / medium or full for the image, use full

[KCMiller401]

Thanks so much. I installed larger pictures, and it worked for that page. I had cropped the pictures to keep them loading quickly, but obviously too much! Do you have a pixel size you like to balance issues like this and loading speed? Thanks again.  

[scrambler]

Wordpress supports a new very efficient system (srcset) that can provide references to multiple resolutions.
This allows you to select a large image, and let the browser automatically select the optimal resolution to use based on the size on screen.

Whatever system you are using to add the images does not seem to take advantage of this.
In Xtreme when you use “Add Media” to add an image in your content, it does use srcset so you dont have to worry about resolution and load efficiency.

So how are you adding the images?
If using a plugin, you may want to ask them why they do not take advantage of the WordPress srcset feature.

But in general, you just want to use the max size that will ever be used, and a compression level that take the file size below 200k.

[KCMiller401]

Thanks so much. I appreciate learning so much on this forum.

[Author]

Posts