How to customize the list?

Question

css

There is a dropdown list, roughly speaking, like this: jsfiddle.net/xdfq9d9v/1
How to adjust the width of the orange part of the list to the widest li? (And, in fact, make sure that the text in li does not wrap).
To make it look like this:

Answer 1

If the list is absolute, then you can't control the width of the parent with CSS, only JS - jsfiddle.net/xdfq9d9v/4

Answer 2

jsfiddle.net/xdfq9d9v/2