У меня имеется div, в котором находятся 4 элемента a. Каждый из имеет ширину и высоту, а также background.
Как сделать так, чтобы добавляя еще они не переносились на следующую строку, и чтобы их размер не сужался, а элементы были скрыты за шириной контейнера?
.symptoms-item {
display: inline-flex;
width: 195px;
height: 130px;
border-radius: 6px;
background-image: linear-gradient(313.26deg, rgba(249, 177, 97, 0.5) 57.2%, rgba(251, 193, 134, 0.5) 84.09%);
}
<div className='symptoms-block'>
<a class="symptoms-item">Проблемы с сердцем</a>
<a class="symptoms-item">Проблемы с сердцем</a>
<a class="symptoms-item">Проблемы с сердцем</a>
<a class="symptoms-item">Проблемы с сердцем</a>
<a class="symptoms-item">Проблемы с сердцем</a>
<a class="symptoms-item">Проблемы с головой</a>
</div>