Как я могу заполнить оставшееся пространство при работе со встроенным ul?

Question

Я использовал этот CSS, чтобы мои UL выглядели модно

ul, li
{
  padding: 0px;
  margin-left: 0px;
  margin-bottom: 0px;
  display: inline;
}

li
{
  border: solid 1px #333333;
  margin-right: 5px;
  padding: 2px;
  background-color: #222222;
  color: #999999;
}

Я бы хотел, чтобы окончательный пустой элемент списка с таким же графическим стилем заполнил оставшееся пространство в строке Что-то вроде

[элемент A] [элемент B] [элемент C] [------ большой пустой ----------]

Можно ли выяснить, сколько места у вас осталось? Не могли бы вы установить ширину 100% для одного из элементов списка?

Спасибо

Answer 1

Вы можете использовать цвет фона / изображение на UL, и сделать UL и LI одинаковой высоты, чтобы придать этот эффект