Как объединить сетку по столбцам, но сложить размеры столбцов? ⇐ CSS

[Anonymous]

Я пытаюсь наложить/сложить столбцы сетки, они перекрываются, как и должны, но я хочу, чтобы размеры каждого столбца вносили вклад в общий размер контейнера. Я мог бы решить эту проблему, продублировав основной элемент, в этом примере тег select. Но есть ли лучший способ сделать это? Мне нужны два ограничения:

• Мне не нужно учитывать положение значков или настраивать их размещение из выделения или контейнера.< /li>
  Не дублирую ни один из элементов.

Я открыт и для других предложений.РЕДАКТИРОВАТЬ: ниже приведены некоторые пояснения:
разрешите мне попробуйте разбить его на части: первый столбец предназначен только для определения размера контейнера, второй столбец — это фактический выбор, и он должен охватывать все столбцы, третий столбец — это значки, и он должен перекрываться поверх второго. Я пытаюсь добиться того же без первого невидимого столбца, который определяет размер контейнера.

Код: Выделить всё

console.clear();

Код: Выделить всё

html,
body {
height: 100%;
}

@font-face {
font-family: FabricMDL2Icons;
src: url(https://spoprod-a.akamaihd.net/files/fabric/assets/icons/fabricmdl2icons.woff)
format("woff"),
url(https://spoprod-a.akamaihd.net/files/fabric/assets/icons/fabricmdl2icons.ttf)
format("truetype");
font-weight: 400;
font-style: normal;
}

Код: Выделить всё

Loading...
Not an option
Option 1



Loading...
Not an option
Option 1



[i]  [/i]
[i]  [/i]

Подробнее здесь: https://stackoverflow.com/questions/793 ... -col-sizes