Проблема с шириной изображения в CSS ⇐ CSS

[Anonymous]

У меня есть 3 изображения, которые должны появиться рядом друг с другом. Однако первое изображение большое, и оно перемещает два других изображения в следующую строку, чего я не хочу. Я создал класс, добавил высоту и ширину, но он не работает.

Код: Выделить всё

.workImgs {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
width: 100vw;
max-width: 100rem;
}

.workImg {
object-fit: cover;
height: 20rem;
margin: 0.5rem;
}

Код: Выделить всё

[url=#]
[img]https://picsum.photos/245/182[/img]
[/url]
[url=#]
[img]https://picsum.photos/185/184[/img]
[/url]
[url=#]
[img]https://picsum.photos/184/165[/img]
[/url]

Это результат пользовательского интерфейса. Я хочу, чтобы первая ширина изображения была равна остатку 2, чтобы они могли находиться в 1 строке. Пытался создать идентификатор различия для большого изображения, но не помогло.



Подробнее здесь: https://stackoverflow.com/questions/783 ... sue-in-css