?
Solved

Need top n rows in an html table fixed

Posted on 2012-04-09
4
Medium Priority
?
247 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
4 Comments
 

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 84

Accepted Solution

by:
Dave Baldwin earned 2000 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

WordPress Tutorial 1: Installation & Setup

WordPress is a very popular option for running your web site and can be used to get your content online quickly for the world to see. This guide will walk you through installing the WordPress server software and the initial setup process.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Have you tried to learn about Unicode, UTF-8, and multibyte text encoding and all the articles are just too "academic" or too technical? This article aims to make the whole topic easy for just about anyone to understand.
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
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 …
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…

764 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