I have setup a Panel to have a width of 100% so that it will adjust to users
screensize. Within the panel I have a table. Unfortunately the table holds
a lot of data and exceeds the size of the screen. The panel has a height of
350px and the scrollbar is set to auto so that both scrollbars appear when
needed. What is happening is that due to the table exceeding the width of
the screen the panel is also enlarging its width larger than the screen and
matching that of the table. I want the panel to stay at the 100% width of
the screen and then if the table exceeds the width then the horizontal
scrollbar appears on the panel.

I know horizontal scrollbars are a bad idea. Unfortunately, I don't have a
choice. :-(

Any ideas? Thanx in advance.

ATR2000

Ok, here is some more information that I discovered.

When the DIV statement is within a table like the following, it fails:

<table>
<tr>
<td>
<div style="overflow: auto; width: 100%; height: 350px;
background: #00FF00; position: relative; white-space:nowrap;">
<div>
<table>
<tr>
ETC...

If I place the DIV tag at the root of the BODY tag then it works fine.

Any thoughts as to why it does that? I need to have this content reside
within a table due to design layout.

ATR2000



"ATR2000" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
>I have setup a Panel to have a width of 100% so that it will adjust to
>users screensize. Within the panel I have a table. Unfortunately the
>table holds a lot of data and exceeds the size of the screen. The panel
>has a height of 350px and the scrollbar is set to auto so that both
>scrollbars appear when needed. What is happening is that due to the table
>exceeding the width of the screen the panel is also enlarging its width
>larger than the screen and matching that of the table. I want the panel to
>stay at the 100% width of the screen and then if the table exceeds the
>width then the horizontal scrollbar appears on the panel.
>
> I know horizontal scrollbars are a bad idea. Unfortunately, I don't have
> a choice. :-(
>
> Any ideas? Thanx in advance.
>
> ATR2000
>

I figured it out. Once I implemented the following style within the table
tag it worked.

<table style="overflow:hidden; table-layout:fixed; position:relative;
width:100%;">
<tr>
<td>
<div style="overflow: auto; width: 100%; height: 350px;
background: #00FF00; position: relative; white-space:nowrap;">
<div>
<table>
<tr>
ETC...

Thanx,

ATR2000


"ATR2000" <(E-Mail Removed)> wrote in message
news:O$(E-Mail Removed)...
> Ok, here is some more information that I discovered.
>
> When the DIV statement is within a table like the following, it fails:
>
> <table>
> <tr>
> <td>
> <div style="overflow: auto; width: 100%; height: 350px;
> background: #00FF00; position: relative; white-space:nowrap;">
> <div>
> <table>
> <tr>
> ETC...
>
> If I place the DIV tag at the root of the BODY tag then it works fine.
>
> Any thoughts as to why it does that? I need to have this content reside
> within a table due to design layout.
>
> ATR2000
>
>
>
> "ATR2000" <(E-Mail Removed)> wrote in message
> news:(E-Mail Removed)...
>>I have setup a Panel to have a width of 100% so that it will adjust to
>>users screensize. Within the panel I have a table. Unfortunately the
>>table holds a lot of data and exceeds the size of the screen. The panel
>>has a height of 350px and the scrollbar is set to auto so that both
>>scrollbars appear when needed. What is happening is that due to the table
>>exceeding the width of the screen the panel is also enlarging its width
>>larger than the screen and matching that of the table. I want the panel
>>to stay at the 100% width of the screen and then if the table exceeds the
>>width then the horizontal scrollbar appears on the panel.
>>
>> I know horizontal scrollbars are a bad idea. Unfortunately, I don't have
>> a choice. :-(
>>
>> Any ideas? Thanx in advance.
>>
>> ATR2000
>>
>
>