Можно ли так сверстать?

Question

[Neznayko]

1. Есть два блока в один ряд
2. В сером есть текстовый контент в один ряд. Он принимает ширину этой строки.
3. Фиолетовый блок растягивается на все что осталось.


Как так сделать?

Answer 1

[Андрей Хохлов]

flexbox если ie10+
либо
display: table > display: table-cell
и, если память не изменяет, у фиолетового блока width: 100%

Answer 2

[kn1ght_t]

https://jsfiddle.net/2ayvs96s/

Answer 3

[Сергей delphinpro]

В дополнение к тому, что предложил Андрей Хохлов есть еще древний способ, которым такую хрень делали еще на шестых осликах

.parent-block {
  display:inline-block;width:100%; /* или другой клирфикс*/
}
.gray-block {
  white-space: nowrap;
  float: right;
}
.purple-block {
  overflow: hidden;
}