I have a table in HTML with a cell that contains 2 divs and a radial tab strip. Here is an example:
<td>
First td
</td>
<td>
Second td
<div>
....
<div style="border: solid; border-color: brown; border-width: 3px; height: 100%; width: 100%;">
<div>
<telerik:RadMultiPage ID="radCustInfo" runat="server" SelectedIndex="0">
<telerik:RadPageView ID="radCustInfoPage" runat="server">
<telerik:RadTabStrip ID="radCustInfoTab" runat="server" MultiPageID="radMultiPageCustInfo"
SelectedIndex="0" Orientation="HorizontalTop" Align="Left">
<Tabs>
<telerik:RadTab Text="Notes" ></telerik:RadTab>
<telerik:RadTab Text="Contacts" ></telerik:RadTab>
..2 more tabs
....</div>
When a user clicks on one of the tabs, such as "Contacts", the cell should expand in height. The "Contacts" tab contains more than 10 items, 5 emails, and 5 phone numbers. The height of the cell is initially set to approximately 180px. I want the other 3 tabs to display parallel to the first td at 180px height. The "Contacts" tab can have a dynamic height. These cells are at the top of the page, so any information below them should be pushed down as the cells grow. If the content in the tabs is less than 180px, the border of the div should be capped at 180px.
In summary: If the content in the tabs is minimal, maintain the cell height at 180px with a border. If the content is extensive, allow the cell to expand. This is a specific question related to my own situation, but I am seeking assistance. Feel free to ask for more information if needed. Thank you.