How to bring the width of the block with text wrapping to the minimum?

Question

css

Here is a case: https://jsfiddle.net/vLgajqu3/
How to make the first green block take up the minimum width (as much as necessary to fit the text), but the second green block is drawn in one line?

Answer 1

If I understood the task correctly:
.block2 {
display: inline;
width: 100%
}
.block2 .one {
width: 80%; float: left; overflow: auto;
}
.block2 .two {
width: 20%; float:right;
}
With a large amount of text, a scrollbar appears in the left column.