Как сделать блок картинок в ряд, при ховере на одну из них, она увеличивается по ширине, а соседние сжимаются пропорционально?

Для создания блока картинок в ряд с эффектом увеличения при наведении на одну из них, можно использовать следующий подход:

1. HTML разметка:

```html

```

2. CSS стили:

```html

.image-row {
display: flex;
}

.image-container {
flex: 1;
overflow: hidden;
transition: flex 0.3s;
}

.image-container:hover {
flex: 3;
}

.image-container img {
width: 100%;
height: auto;
transition: transform 0.3s;
}

.image-container:hover img {
transform: scale(1.2);
}

```

Этот код создаст ряд блоков с изображениями, которые будут увеличиваться при наведении мыши. При этом соседние изображения будут сжиматься пропорционально.

По умолчанию блоки будут равномерно распределены в ряду. При наведении на изображение оно увеличится в размерах, занимая больше места, а соседние изображения будут уменьшены.

Таким образом, вы сможете создать интересный эффект для блока картинок в ряде на вашем сайте.