Solved

Need top n rows in an html table fixed

Posted on 2012-04-09
4
240 Views
Last Modified: 2012-04-10
Need top n rows in an html table fixed so they are always visible when I scroll down a table
0
Comment
Question by:robrodp
4 Comments
 
LVL 40

Expert Comment

by:gurvinder372
ID: 37824248
0
 

Author Comment

by:robrodp
ID: 37824541
Either they are too complicated or dont work across browsers.

Somebody must have a simple and elegant solution. Just plain HTML5, no plugings etc
0
 
LVL 82

Accepted Solution

by:
Dave Baldwin earned 500 total points
ID: 37824641
On another question, the only 'complete' working solution was to use two tables and make sure the <td> widths were identical on both tables.  The top or 'header' table was just a single row.  The bottom table was set to scroll.
0
 
LVL 12

Expert Comment

by:Anuradha Goli
ID: 37827427
Create two tables one with fixed rows and other with scrollable height.
<html>
<head>
    <title></title>
</head>
<body>
    <table style="width: 300px" cellpadding="0" cellspacing="0">
        <tr>
            <td>
                Column 1
            </td>
            <td>
                Column 2
            </td>
        </tr>
    </table>
    <div style="overflow: auto; height: 100px; width: 320px;">
        <table style="width: 300px;" cellpadding="0" cellspacing="0">
            <tr>
                <td>
                    Value 1
                </td>
                <td>
                    Value 2
                </td>
            </tr>
            <tr>
                <td>
                    Value 1
                </td>
                <td>
                    Value 2
                </td>
            </tr>
            <tr>
                <td>
                    Value 1
                </td>
                <td>
                    Value 2
                </td>
            </tr>
            <tr>
                <td>
                    Value 1
                </td>
                <td>
                    Value 2
                </td>
            </tr>
            <tr>
                <td>
                    Value 1
                </td>
                <td>
                    Value 2
                </td>
            </tr>
            <tr>
                <td>
                    Value 1
                </td>
                <td>
                    Value 2
                </td>
            </tr>
        </table>
    </div>
</body>
</html>

Open in new window

0

Featured Post

What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
Newbie CSS questions 4 27
aligning image inside table cell 4 28
Syntax Error 6 32
Fixing my modal from bootstrap 18 16
Deprecated and Headed for the Dustbin By now, you have probably heard that some PHP features, while convenient, can also cause PHP security problems.  This article discusses one of those, called register_globals.  It is a thing you do not want.  …
Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …

744 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now