Как предотвратить сдвиг изображений при изменении размера окна браузера?

Чтобы предотвратить смещение изображений при изменении размера окна браузера и сделать так, чтобы изображения оставались в связке с текстом, вы можете использовать несколько подходов с помощью CSS. Вот некоторые из них:

### 1. Использование Flexbox

Flexbox позволяет удобно располагать элементы в строку и обеспечить их адаптивное поведение при изменении размеров. В вашем случае можно использовать его следующим образом:

```html
<div class="glavna">
    <div class="text">
        <a>Быстрые <br>займы на карту</a>
    </div>
    <div class="img">
        <div class="img1">
            <img src="/aaas/Frame 385.png" alt="Image description 1">
        </div>
        <div class="img2">
            <img src="/aaas/Frame 384.png" alt="Image description 2">
        </div>
    </div>
</div>
```

```css
.gavna {
    display: flex;
    flex-direction: row;
    align-items: center; /* Выравнивание по центру по вертикали */
}

.text {
    flex: 1; /* Занимает доступное пространство */
}

.img {
    display: flex;
    flex-direction: row;
    align-items: center; /* Выравнивание по центру по вертикали */
}

.img1, .img2 {
    margin-left: 10px; /* Отступ между изображениями */
}
```

### 2. Использование CSS Grid

Альтернативно, CSS Grid также может быть эффективным для размещения текста и изображений. Вот пример:

```css
.gavna {
    display: grid;
    grid-template-columns: 1fr auto; /* 1 колонка для текста, авто для изображений */
    align-items: center; /* Выравнивание по центру по вертикали */
}

.img {
    display: flex;
    gap: 10px; /* Отступ между изображениями */
}
```

### 3. Использование процентных ширин и высот

Если вы хотите, чтобы изображения адаптировались при изменении размера окна, вы можете установить ширину изображений в процентах и задать `max-width`:

```css
.img1 img, .img2 img {
    width: 100%; /* Или фиксированный процент */
    max-width: 200px; /* Максимальная ширина для изображения */
    height: auto; /* Автоматическая высота для сохранения пропорций */
}
```

### 4. Медиа-запросы для дальнейшей настройки

Хотя вы упомянули, что создание медиа-запросов на каждый пиксель кажется сложным решением, это может быть полезным для более точной настройки на различных размерах экранов. Например, вы можете использовать что-то вроде:

```css
@media (max-width: 600px) {
    .glavna {
        flex-direction: column; /* На маленьких экранах текст и изображения в колонку */
    }
}
```

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