JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box">
    <div class="block">Привет. Мне нужно сделать три колонки: 1 2 3. Первая с левого края резиновая — по ширине текста внутри неё. Вторая резиновая от первой до третьей. Третья с правого края — её можно считать фиксированной, допсутим, шириной 100 пикселей. Хоть тресни — не понимаю как сделать, хотя кажется, что вообще всё элементарно. Прямо хоть таблицей делай. Я выжил из ума или это и правда как-то нетривиально?</div>
    <div class="block"> средство содержит активные ингредиенты, нейтрализующие запах и маскирующие цвет отходов, эффективно подавляет развитие гнилостных процессов, предотвращает газообразование, способствует растворению твердых отходов и легкому очищению баков;</div>
    <div class="fix block">Третья с правого края — её можно считать фиксированной, допсутим, шириной 100 пикселей</div>
</div>

CSS

* {
    -moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.block {
    font-family: arial;
    float: left;
    width: 50%;
    font-size: 12px;
    padding: 10px 20px;
}

.block.fix {
    width: 200px;
    margin-right: -100%;
}

.box {
    padding-right: 200px;
}