Solved

HML Table to occupy 100% of the page

Posted on 2013-01-13
3
396 Views
Last Modified: 2013-02-03
My requirement is for a table to occupy the full size of the page (both width and height). the width works but not the height. Pls see code attached. What am I missing?

<html xmlns="http://www.w3.org/1999/xhtml" style="height:100%">
<head runat="server">
    <title></title>
    <style>
        table {
            border: double;
            width: 100%;
            height:100%
        }              

    </style>
</head>
<body style="height:100%">
    <form id="form1" runat="server">
   

        <table>
            <tr>
                <td> header row</td>
            </tr>
            <tr>
                <td> Footer Row</td>
            </tr>
        </table>
   
   
    </form>
</body>
</html>
0
Comment
Question by:TrialUser
3 Comments
 
LVL 52

Expert Comment

by:Scott Fell, EE MVE
ID: 38773217
Just add this to your css    demo

html, body{
  height: 100%;
}
table {height:100%;width:100%;}
0
 
LVL 18

Accepted Solution

by:
Rartemass earned 500 total points
ID: 38773276
In your code you are missing the semi colon after the height:100%. That may account for the issue.

    <style>
        table {
            border: double;
            width: 100%;
            height:100%
        }              

    </style>

You should however follow Padas' example and put all style information into a CSS file.
0
 
LVL 23

Expert Comment

by:Roopesh Reddy
ID: 38773401
Hi,

Interesting read on setting Table height - http://www.apptools.com/examples/tableheight.php

Hope it helps u...
0

Featured Post

Free Trending Threat Insights Every Day

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

Join & Write a Comment

Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …

762 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

20 Experts available now in Live!

Get 1:1 Help Now