I tried to put the table in div. Though I am able to see the scroll bar
but it doesn't satisfy the requirements. The reasong being
1) I don't want horizontal scroll bars. Is there a way to supress the
horizontal scroll bar along with vertical scroll bars peeing up when the
content exceeds the height of 200 px.
2) when <div style="height:2 00px; overflow:scroll ">
tag is applied around the <table> tag the vertical and horizontal
scroll bars appear to the full width of the page, though the table's
width is just half of the screen width.
3) Further if there are very few rows in the table, even then the scroll
bars appear.
Here is the code of the page.
<html><head><ti tle>Table Test</title>
<style type="text/css">
body { font-family: arial;}
table { border-color: darkblue; border-style: solid; border-width: 1px;
}
td, th {
font-family: Arial; font-size: 10pt; background-color: grey;
padding: 2px; padding-left: 6px; padding-right: 6px;
}
section-header{
background-color: darkblue; font-size : 18px; font-weight: bold;
font-style: normal; text-align: left; padding-left: 5px; vertical-align:
middle;
}
</style>
</head>
<body>
<div style="height:2 00px; overflow:scroll ">
<table cellpadding="0" cellspacing="1" width="800px">
<thead>
<tr style="backgrou nd-color:#008000;c olor:#ffffff;">
<th class="section-header">Name</th>
<th class="section-header">Positio n</th>
<th class="section-header">Number Added</th>
<th class="section-header">Number Removed</th>
</thead>
<tbody>
<tr><td>AAA</td><td>Left</td><td>122-456-789</td><td>122-456-788</td></t
r>
<tr><td>BBB</td><td>Left</td><td>123-456-789</td><td>123-456-788</td></t
r>
<tr><td>CCC</td><td>Right</td><td>233-456-789</td><td>233-456-788</td></
tr>
<tr><td>DDD</td><td>Left</td><td>234-456-789</td><td>234-456-788</td></t
r>
<tr><td>EEE</td><td>Right</td><td>238-456-789</td><td>238-456-788</td></
tr>
<tr><td>FFF</td><td>Right</td><td>235-456-789</td><td>235-456-788</td></
tr>
<tr><td>GGG</td><td>Left</td><td>236-456-789</td><td>236-456-788</td></t
r>
<tr><td>AAA</td><td>Left</td><td>122-456-789</td><td>122-456-788</td></t
r>
<tr><td>BBB</td><td>Left</td><td>123-456-789</td><td>123-456-788</td></t
r><tr>
<td>CCC</td><td>Right</td><td>233-456-789</td><td>233-456-788</td></tr>
<tr><td>DDD</td><td>Left</td><td>234-456-789</td><td>234-456-788</td></t
r>
<tr><td>EEE</td><td>Right</td><td>238-456-789</td><td>238-456-788</td></
tr>
<tr><td>FFF</td><td>Right</td><td>235-456-789</td><td>235-456-788</td></
tr>
<tr><td>GGG</td><td>Left</td><td>236-456-789</td><td>236-456-788</td></t
r>
</tbody>
</table>
</div>
</body>
</html>
Can sombody able to help me in this?
*** Sent via Developersdex
http://www.developersdex.com ***
