Boostsram. Crooked website needs to be fixed. How to transform a grid with images?

Question

css

www.luxtort.ru/statii here is the page
the site is laid out on the buststststsrame
On the page there are a couple of blocks in which links-pictures in the form of a grid.
their code is like this:

<span>
    <a href="">
        <img src="kortinka.жипег" />
    </a>
</span>

The images are all different sizes. The layout genius gave the images inline styles - width, height, although images do not really trust these values, only widths are obeyed.
And here is my task: to align this whole topic.
What I want to do is to make sure that all the pictures are 240x240, and everything that does not fit into this gap is cut off.
Here I am fighting for the second evening already - nothing helps, everything is crooked, booststsram does not allow me to make a normal layout.
Pamagity, thank you)

Answer 1

Remove width and height from images in HTML.

span.moloko a {
    /* overflow: hidden; */
    /* max-height: 160px; */
    overflow: hidden;
    width: 240px;
    height: 240px;
    display: block;
}
.moloko {
    display: inline-block;
    background-color: #fff;
    position: relative;
}
span.moloko img {
    vertical-align: top;
    width: 100%;
    height: 100%;
}