HTML and CSS

Table = 100% in IE but not in FireFox?

Please support our HTML and CSS advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases

•

Join Date: Jun 2004

Posts: 247

Reputation: cmills83 is an unknown quantity at this point

Solved Threads: 1

cmills83

Offline

Posting Whiz in Training

Table = 100% in IE but not in FireFox?

Jun 25th, 2005

<< URL Snip -- Please post code only, thanks >>

The table extends to the bottom in IE but not in FireFox, any ideas? Thanks!

•

Join Date: May 2005

Posts: 232

Reputation: Dogtree is an unknown quantity at this point

Solved Threads: 3

Dogtree

Offline

Posting Whiz in Training

Re: Table = 100% in IE but not in FireFox?

Jun 25th, 2005

The height attribute doesn't exist in any portable HTML specification. You're relying on an IE extension. A workable solution is CSS:

 Help with Code Tags 
 HTML and CSS Syntax (Toggle Plain Text) 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type="text/css">
html,body {
  margin:0;
  padding:0;
  height:100%;
  width:100%;
}
 
table.full-height {
  height:100%;
  width:100%;
  border:1px solid black;
}
</style>
</head>
<body>
  <table class="full-height"><tbody><tr>
    <td>This is a test</td>
  </tr></tbody></table>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type="text/css">
html,body {
  margin:0;
  padding:0;
  height:100%;
  width:100%;
}

table.full-height {
  height:100%;
  width:100%;
  border:1px solid black;
}
</style>
</head>
<body>
  <table class="full-height"><tbody><tr>
    <td>This is a test</td>
  </tr></tbody></table>
</body>
</html>

•

Join Date: Jun 2004

Posts: 247

Reputation: cmills83 is an unknown quantity at this point

Solved Threads: 1

cmills83

Offline

Posting Whiz in Training

Re: Table = 100% in IE but not in FireFox?

Jun 26th, 2005

I'm afraid you are the man of the year. Thanks again for the help!

•

Join Date: Jun 2007

Posts: 1

Reputation: Rumor is an unknown quantity at this point

Solved Threads: 0

Rumor

Offline

Newbie Poster

Re: Table = 100% in IE but not in FireFox?

Jun 13th, 2007

•

Originally Posted by Dogtree

The height attribute doesn't exist in any portable HTML specification. You're relying on an IE extension. A workable solution is CSS:
Help with Code Tags

HTML and CSS Syntax (Toggle Plain Text)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type="text/css">
html,body {
  margin:0;
  padding:0;
  height:100%;
  width:100%;
}
 
table.full-height {
  height:100%;
  width:100%;
  border:1px solid black;
}
</style>
</head>
<body>
  <table class="full-height"><tbody><tr>
    <td>This is a test</td>
  </tr></tbody></table>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <style type="text/css"> html,body { margin:0; padding:0; height:100%; width:100%; } table.full-height { height:100%; width:100%; border:1px solid black; } </style> </head> <body> <table class="full-height"><tbody><tr> <td>This is a test</td> </tr></tbody></table> </body> </html>

Hi there,

I used to work this out by a tip I found on the web, similar to this:
I used to apply a class (fullHeight) to the html tag, but this is not valid code for XHTML.
So, while all other browsers parsed my page correctly, ie did not parse it properly when I had the class attribute there.
Then I did what you posted to bypass the invalid code, but again ie parse it wrong.
Is there any case that applying properties to the html object is invalid in any way?

•

Join Date: Jul 2007

Posts: 1

Reputation: MichaelRoof is an unknown quantity at this point

Solved Threads: 0

MichaelRoof MichaelRoof is offline

Offline

Newbie Poster

Re: Table = 100% in IE but not in FireFox?

Jul 26th, 2007

Just add the form tag to the previous posting. The reason it is not working could be because the a parent (form) object is not being expanded to 100%. <br>

Try This:

 Help with Code Tags 
 HTML and CSS Syntax (Toggle Plain Text) 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type="text/css">
html,body, form {
  margin:0;
  padding:0;
  height:100%;
  width:100%;
}
 
table.full-height {
  height:100%;
  width:100%;
  border:1px solid black;
}
</style>
</head>
<body>
  <table class="full-height"><tbody><tr>
    <td>This is a test</td>
  </tr></tbody></table>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type="text/css">
html,body, form {
  margin:0;
  padding:0;
  height:100%;
  width:100%;
}

table.full-height {
  height:100%;
  width:100%;
  border:1px solid black;
}
</style>
</head>
<body>
  <table class="full-height"><tbody><tr>
    <td>This is a test</td>
  </tr></tbody></table>
</body>
</html>

Last edited by MichaelRoof; Jul 26th, 2007 at 2:20 pm.

•

Join Date: Jan 2007

Posts: 3,210

Reputation: MidiMagic has a spectacular aura about

Solved Threads: 165

MidiMagic

Offline

Nearly a Senior Poster

Re: Table = 100% in IE but not in FireFox?

Jul 28th, 2007

You are never going to have a screen-filling design for all users, for the simple reason that different computers are set up for different screen settings.

For example, my father still uses 800 X 600 because of his bad vision.

Daylight-saving time uses more gasoline