HTML table column freeze

Discussion in 'HTML & Website Design' started by venkata_kesava, Sep 15, 2009.

0
  1. #1
    :) Hello everyone, do any one has idea on how to implement freeze of HTML table column. I am working on this for past 2 days but i do not get any idea on how to implement this. Please suggest me how to approch

    Thanks in advance
     
    venkata_kesava, Sep 15, 2009 IP
  2. Design_Guy

    Design_Guy Peon

    Messages:
    35
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    You will have to make use of the CSS position: fixed; property.

    But there will be much more to do to get it to be fully readable.

    You could use Javascript also, but that can get more complicated then this way.
     
    Design_Guy, Sep 15, 2009 IP
  3. venkata_kesava

    venkata_kesava Peon

    Messages:
    20
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    If i use fixed and if i move the scroll then the columns next to it should be hidden. I want to support feature same as microsoft excel freeze
     
    venkata_kesava, Sep 15, 2009 IP
  4. Design_Guy

    Design_Guy Peon

    Messages:
    35
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    The fixed column (the first td in each tr) will be above the columns when you scroll and stay at the start of table.

    Make sure you put a background color on the fixed TD's or it will not be readable. Also, you will need to position the fixed TD away from the other TD's as it will cover the second column.

    
<table>
<tr>
<td style="position: fixed;">Data</td>
<td>Data</td>
<td>Data</td>
<td>Data</td>
</tr>
<tr>
<td style="position: fixed;">Data</td>
<td>Data</td>
<td>Data</td>
<td>Data</td>
</tr>
</table>
    Code (markup):
     
    Design_Guy, Sep 15, 2009 IP