Help me to Freeze Header in Grid View, You can change the Design but Header should be visible |
Help me to Freeze Header in Grid View, You can change the Design but Header should be visible |
Hashan |
Feb 2 2011, 12:02 PM
Post
#1
|
Group: Members Posts: 3 Joined: 2-February 11 Member No.: 13,769 |
You can change the Design but Header should be visible. In my design when am going to enter more rows header not visible so its difficult to identify which column that am entering data while enter large amount of data...
Please help me to overcome this Problem asap....... Download my Source code : http://www.adrive.com/public/0f3250fa9592f...f18227c721.html Or Documents.rar ( 4k ) Number of downloads: 537 |
Christian J |
Feb 2 2011, 02:53 PM
Post
#2
|
. Group: WDG Moderators Posts: 9,661 Joined: 10-August 06 Member No.: 7 |
Instead of making the table body scrollable you might make the table head fixed. This works in all my new browsers, including IE8. But since fixed positioning offset is always done relative to the viewport it doesn't work well with fluid page layouts, unless the table is the first element at the top/left:
CODE <style type="text/css" media="screen"> table { position: absolute; top: 1.5em; left: 1em; } #fixed { position: fixed; top: 0.2em; left: 1em; } th, td { width: 100px; /* percent doesnt seem to work */ padding: 10px; /* explicit padding needed for equal TH & TD width */ border: 1px solid #000; } th {background: blue;} td {background: pink;} td {height: 1000px;} </style> <table> <tr id="fixed"> <th>foo</th> <th>bar</th> </tr> <tr> <td>foo</td> <td>bar</td> </tr> </table> This post has been edited by Christian J: Feb 2 2011, 04:29 PM |
Hashan |
Feb 2 2011, 10:35 PM
Post
#3
|
Group: Members Posts: 3 Joined: 2-February 11 Member No.: 13,769 |
Instead of making the table body scrollable you might make the table head fixed. This works in all my new browsers, including IE8. But since fixed positioning offset is always done relative to the viewport it doesn't work well with fluid page layouts, unless the table is the first element at the top/left: CODE <style type="text/css" media="screen"> table { position: absolute; top: 1.5em; left: 1em; } #fixed { position: fixed; top: 0.2em; left: 1em; } th, td { width: 100px; /* percent doesnt seem to work */ padding: 10px; /* explicit padding needed for equal TH & TD width */ border: 1px solid #000; } th {background: blue;} td {background: pink;} td {height: 1000px;} </style> <table> <tr id="fixed"> <th>foo</th> <th>bar</th> </tr> <tr> <td>foo</td> <td>bar</td> </tr> </table> Thank you very much for your Consideration.. IF you can please help me to apply this to my Page because i'm facing a problem when trying to apply this to my page....This is very urgent for my College Project... |
Christian J |
Feb 3 2011, 07:26 AM
Post
#4
|
. Group: WDG Moderators Posts: 9,661 Joined: 10-August 06 Member No.: 7 |
IF you can please help me to apply this to my Page because i'm facing a problem when trying to apply this to my page....This is very urgent for my College Project... Sorry, no time for that. Your source code contains lots of errors that you should fix. Use the "Validator" link at the top of this page. I also suggest that you use an ordinary, simple table (currently there lots of unnecessary nested ones). |
pandy |
Feb 3 2011, 08:57 AM
Post
#5
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,733 Joined: 9-August 06 Member No.: 6 |
You use several tables already, so why not move the header row out of the scrolling table? Also, I see no need to nest the tables.
|
Lo-Fi Version | Time is now: 27th April 2024 - 08:03 AM |