Как правильно позиционировать блоки кирпичной кладки?
При расположении изображений в стиле "masonry" постоянно то сбиваются расстояния между ними, то по высоте они размещаются не в одну линию. Использую display: grid для такого размещения, и при необходимости задать отступы между изображениями, даже несмотря на то, что они пропорциональны в размерах, они перестают выравниваться по одной границе (по высоте).
div {
width: 200px;
display: grid;
align-items: end;
grid-gap: 10px;
grid-template-areas: "a b" "c b";
}
img:nth-child(1) {
grid-area: a;
}
img:nth-child(2) {
grid-area: c;
}
img:nth-child(3) {
grid-area: b;
}<div>
<img src="https://cs6.pikabu.ru/avatars/716/v716268-731801248.jpg"/>
<img src="https://yt3.ggpht.com/ytc/AAUvwngWFcWm7u0yMSpdBO8beLJ-p1VDlS2gSwGc2FR57w=s100-c-k-c0x00ffffff-no-rj"/>
<img src="https://chatovka.net/avatar/534218.jpg"/>
</div>Есть ли возможность вообще в css избежать такой проблемы?