GWTBootstrap3 equivalent of android's "match-parent"

Question

Is there any way to fix the size of a Panel to take up the full space inside its Column instead of wrapping around the content?

My parent column has 2 panels side by side- one for stacked Navpils menu (with variable number of items) and one to show the data based on menu choice. I need the data panel to match the height of the menu panel.

Here's the relevant section of code:

<b:Column size="MD_3">                          
    <b:Panel>
        <b:PanelHeader>
            <b:Heading size="H3" text="Services" />
        </b:PanelHeader>
        <b:PanelBody>
            <b:NavPills stacked="true">
                <b:AnchorListItem text="ClockService" ui:field="clockService" />                        
                <b:AnchorListItem text="CloudService" ui:field="cloudService" />
                <b:AnchorListItem text="CommandService" ui:field="commandService" />
                <b:AnchorListItem text="WebConsole" ui:field="webConsole" />
                <b:AnchorListItem text="DataService" ui:field="dataService" />
                <b:AnchorListItem text="MqttDataTransport" ui:field="mqttDataTransport" />
                <b:AnchorListItem text="SslManagerService" ui:field="sslManagerService" />
                <b:AnchorListItem text="WatchdogService" ui:field="watchdogService" />
            </b:NavPills>
        </b:PanelBody>
    </b:Panel>
</b:Column>

<b:Column size="MD_9">
    <b:Panel ui:field="contentPanel">
        <b:PanelHeader ui:field="contentPanelHeader">
        </b:PanelHeader>
        <b:PanelBody ui:field="contentPanelBody">
        </b:PanelBody>
    </b:Panel>
</b:Column>

Any help or suggestions are appreciated, I'm also open to using other widgets as long as they provide a similar view.

Answer 1

If you want the contents of a *Panel to use up all the available space, just wrap its contents in a Column with the appropriate size (like MD_12). Depending on your layout, it might be sufficient to reverse the hierarchy - the Panel should be the parent and the Column its child. If you have a lot of situations like this (or this is a widget that's used a lot), you can avoid "unnecessary" wrapping by just applying the CSS style .col-md-12 to your widget (the Panel's contents) directly.