Как сделать такой блок/таблицу?

Question

[GreenMan1899]

Надо сделать такой блок. Это вроде как таблица. Но у нее первые два столбца могут быть разной ширины исходя из контента. Фиксированная ширина только у третьего.
А если не выставлять ширину этим двум, то таблица ведет себя не так, как нужно:

Comments

[Ankhena]

Ваш код -> jsfiddle.net

И скрин таблицы иллюстрирующий это

у нее первые два столбца могут быть разной ширины исходя из контента.

[GreenMan1899]

Ankhena, https://codepen.io/danilst/pen/VRPBRj?editors=1100

[GreenMan1899]

Ankhena, вот

[Ankhena]

GreenMan1899, https://codepen.io/anon/pen/QodZrE так чтоль?

Или как нужно-то?

[GreenMan1899]

Ankhena, сейчас от 35 932 остается белое поле слева. Хотя по идее тк это самое большое число в колонке, то колонка должна быть той же шириной, что и самое большое число. А сейчас оно немного больше почему-то.
Хз почему так таблицы работают и можно ли что-то сделать с этим.

[GreenMan1899]

Ankhena, сделал на гридах. Обновил в примере. Только не работают префиксы для IE

[Ankhena]

GreenMan1899, на гридах не вижу.
Пока так: Css grid не работает в IE11?

[GreenMan1899]

Ankhena, https://codepen.io/danilst/pen/LaxXZo

[Ankhena]

GreenMan1899, так работает https://codepen.io/anon/pen/zbNyRr

[GreenMan1899]

Ankhena, тут вроде как не универсально вышло. Если будет больше строк, то всем новым так же раздавать новый класс .line_ придется?

[Ankhena]

GreenMan1899, универсально не придумала.
Я бы оставила таблицами.

Answer 1

[Роман]

Гриды идеально подойдут для вашей задачи. Если есть пробелы в знаниях - вот хорошая статья

Comments

[GreenMan1899]

нужна обязательна поддержка ie11

[Роман]

GreenMan1899, Can I Use В IE 11 вроде есть поддержка css grid с префиксом ms

[GreenMan1899]

Роман, https://codepen.io/danilst/pen/LaxXZo сделал на гридах. Вроде добавил префиксы правильно, но все равно на ie11 не работает. Не подскажите, что не так?