I stumbled upon a question that sparked my interest recently, and I've been attempting to apply some of the suggestions provided. Unfortunately, I have been facing difficulties in implementing them successfully. The issue lies with an ASPx page where I have two tables stacked vertically. While I have managed to format the top table to my satisfaction, I am struggling with the bottom one. My goal is to ensure that it fits within the window or alternatively displays a vertical scrollbar.
To address this, I have enclosed the bottom table within a div tagged with overflow-style: auto; in the CSS file. Additionally, I have included the following script on the page to handle resizing:
$(function () {
$('.tblContent table').css({ 'height': (($(window).height()) - 50) + 'px' });
$(window).resize(function () {
$('.tblContent table').css({ 'height': (($(window).height()) - 50) + 'px' });
});
});
The structure of my div element appears as follows:
<div class="tblContent">
Within the CSS file, I have defined the styling for tblContent as follows:
.tblContent
{
overflow-style: auto;
}