height of tab-group never be changed.

[cascopia]

I want to put 'toolbar' and 'statusbar' above and under the , respectively.

Something like this, without the left sidebar:

However, with any means, I couldn't set the size of the 's height, though, the width can be changed easily.
Every time, the height of was fixed to occupy the whole Browser height.

Here are things I've tried but failed:

1. <tab-group style="height:500px">
2. <tab-group style="flex-grow: 1"> with "display: flex" wrapper div.
3. <tab-group style="position:absolute; top: 40px; bottom: 40px ...">
4. <tab-group style="position:absolute; top: 40px; height: 500px ...">
5. <tab-group style="display: table-row ..."> with "display: table" wrapper div.
6. Direct <table><tr height="500"> and <table><tr style="height:500px"> ..
7. With "!important" prefix.
8. Using with <tab-group ..><style> .etabs , webview, .views ... </style>

Is there something that I missed?

[brrd]

Try this:

<tab-group new-tab-button="true" sortable="true">
  <style>
    .views {
      height: calc(100vh - 100px);
    }
  </style>
</tab-group>
<div class="footer">Footer</div>

But you're right, we can improve this. See #175.