My blog content somehow became incredibly spaced out?

Site URL: https://jordanpowersphotography.com/blog

For some reason, my blog content is distorted. The space between the text and image content is extreme. In some cases, the images that I have in there aren't even showing up - but if you click on the empty space, they populate. Not sure how or why this happened. Any help would be appreciated. I apologize I am not sure how to best word what is happening so you may just have to look: https://jordanpowersphotography.com/blog

Ishimoto is a good template, and this is a very strange effect. Do you have some kind of code, any unusual animation you are using? Is the blank space a slide show or grid? In other words how is the image block designed? It seems like your images have a white overlay which hides it but you see it in the lightbox. 

2 hours ago, derricksrandomviews said:

Do you have some kind of code

That appears to be the issue. A CSS issue.

I suggest removing all custom CSS code dealing with gallery images. Save a copy in a file if you want to bring it back. In the short term your images should repair.

Let us know how it goes.

What was the goal of this CSS? If we know what it was, we may be able to suggest a better approach.

Following is some analysis for this issue.

Here is what I found. I used my browser inspector to take a look at the gigantic white spaces. Some are galleries in a grid layout. I discovered that the image elements have a width and height of 0 (the center 0x0 is the w/h). Hence the reason the images don't display.

Not good. Let's take a look at the CSS for that img element.

The first thing we see is that a whole bunch of rules are crossed out. Not good. The gallery is sized/resize by JavaScript code that dynamically resizes each image based on the size of the browser window. That code is working but something is overriding what the code is doing to make things work properly.

Lets scroll down the style rules to see if we can find a problem.

Ah ha! There is some rules that are overriding the img elements style attribute because of the use of !important declarations. Most importantly the height and width of the img. When I turned off those rules the images were visible again.

At this point it looks like we've found the main issue. It appears that some custom CSS was added to the site that is causing an issue.