Для того чтобы ширина блока в гибком (flexbox) контейнере подстраивалась под содержимое, можно использовать свойства `flex-grow`, `flex-shrink` и `flex-basis`. В вашем случае, вам необходимо установить `flex-grow` и `flex-shrink` равными 0, а `flex-basis` установить в значение `auto`, либо просто использовать `flex: 0 0 auto;`. Также важно убедиться, что свойство `width` блока не установлено в значение, фиксирующее ширину, или если установлено, чтобы оно было `auto`.
Пример:
```css
.flex-container {
display: flex;
/* другие свойства для контейнера ... */
}
.flex-item {
flex: 0 0 auto;
/* width: auto; не обязательно, поскольку это значение по умолчанию для width */
/* другие свойства для элемента ... */
}
```
HTML:
```html
<div class="flex-container">
<div class="flex-item">Текст, который определит ширину</div>
<div class="flex-item">Ещё текст</div>
<!-- другие элементы -->
</div>
```
Чтобы блок внутри flexbox не растягивался за пределы содержимого, даже если текст занимает несколько строк, вы также можете применить `white-space: nowrap;` чтобы предотвратить перенос текста на новую строку, если это подходит для вашего случая использования. Также, убедитесь, что не заданы минимальная (`min-width`) или максимальная (`max-width`) ширины, которые могут принудительно увеличить или сократить размер блока.
Если вы хотите, чтобы текст переносился на новую строку, но ширина элемента все равно соответствовала максимальной ширине текста, тогда используйте настройки flex, указанные выше, и убедитесь, что `min-width`, `max-width` и `width` не мешают этому поведению. Свойство `white-space` в таком случае не должно быть установлено в `nowrap`, чтобы текст мог переноситься на новую строку нормально.
