У меня есть такая структура:
<li class="parent">
<span class="float-left less-important">Overflowing content...</span>
<span class="float-right more-important">More Overflowing content...</span>
</li>
Оба элемента <span>
могут иметь переполненный контент.Однако я хочу, чтобы второй <span>
имел приоритет и расширялся, когда его содержимое переполнялось, уменьшая тем самым первый диапазон (первый диапазон будет использовать text-overflow: ellipsis;
для обработки переполнения).Если второй <span>
имеет минимальное содержимое, я хочу расширить первый <span>
до определенной ширины.
Это можно сделать с помощью простого CSS, чтобы второй <span>
продолжалсярасширить и первый <span>
будет сжиматься до определенной точки?Я предполагаю, что это можно сделать с помощью свойств минимальной / максимальной ширины.К сожалению, я не смог найти способ заставить первый <span>
сжаться.Вместо этого происходит то, что второй пролёт переходит на следующую строку.Кроме того, оба этих диапазона установлены на float
(я не могу это контролировать).