I was wondering earlier today how I would go about using the hbox layout (which I assume is the right one for this instance) in rendering a layout that contained two items.
The first item was a Panel, and within the Panel would be a variable-width amount of items (and so the panel should resize itself to a certain width automatically - I had hoped).
The second item was another Panel, but I wanted it to take up the remaining width of the container.
I tried simply adding the first panel with no flex or fixed width attribute, and then tried placing the second panel with flex: 1 to try and take up the remainder of the space.
The results were not desirable; instead of the first panel just taking up 'enough space' that it needed to show its inner contents, it was either hidden because of the second flex: 1 or some other problem.
What is the correct way to:
* Show two columns in the container
* The first column should take up as least amount of space as possible (depending on its item contents - which also may be dynamic in width, etc)
* The second column should take up the remainder of the space
I get the feeling I need to tell ExtJS that an item should either have a fixed width, or tell it to take up a ratio of the available container space. There doesn't seem to be a way to say 'take up as much space as you need, but nothing more'.