XHTMLforum - Chat prschreiben - Glecih 3 peinliche Fehler...

Morgen, Webentwickler.
Ich war gerade einen Chat am Schreiben und stoße schon direkt
auf 3 peinliche Fehler, wo ich mir einfach nicht helfen kann.

Der thread passt irgendwie teils in (x)html, teils css oder auch js,
aber hier die Codes ->

index.php (generierter Quelltext, Serverseitiger Code spielt keine Rolle):

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>test</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<link rel="stylesheet" type="text/css" href="style.css">

<script type="text/javascript">

document.getElementById('log').innerHTML = '';

</script>

</head>

<body>



<table class="all" cellpadding="0" cellspacing="0">

<tr>

  <td class="header" colspan="2">

  &nbsp;



  </td>

</tr><tr>

  <td class="ausgabe">



  <span id="log">Getrennt...</span>



  </td><td class="userliste">



  Getrennt...



  </td>

</tr><tr>



  <td class="eingabe" colspan="2" align="center">

  <input type="text" class="eingabe_text"><input type="submit" class="eingabe_command" value="Enter!">

  </td>

</tr>

</table>



</body>

</html>

style.css

Code:

body {

  padding: 0px;

  margin: 0px;

  background-color: #EBDC00;

  font-family: arial;

  font-size: 9pt;

  color: #320A00;

}

.all {

  border-collapse: collapse;

  padding: 0px;

  margin: 0px;

  width: 100%;

  height: 100%;

}

.header {

  width: 100%;

  height: 70px;

  background-color: #E1D317;

  border: 0px;

  border-bottom: 1px solid #000000;

}

.ausgabe {

  background-color: #EBDC00;

  vertical-align: top;

  padding: 5px;

  font-size: 10pt;

  border: 0px;

}

.userliste {

  background-color: #DDCF17;

  vertical-align: top;

  padding: 5px;

  font-size: 10pt;

  width: 100px;

  border: 0px;

  border-left: 1px solid #000000;

}

.eingabe {

  vertical-align: middle;

  width: 100%;

  height: 100px;

  background-color: #E1D317;

  border: 0px;

  border-top: 1px solid #000000;

}

.eingabe_text {

  margin: 0;

  height: 20px;

  width: 600px;

  background-color: #E1D317;

  border: 1px solid #000000;

}

.eingabe_command {

  margin: 0;

  height: 20px;

  width: 50px;

  background-color: #E1D317;

  border: 1px solid #000000;

}

Problem 1:
In html 4.01 Transitional ist die Tabelle nicht wirklich 100% hoch.
Obwohl ich angegeben habe, dass die Tabelle 100% hoch ist,
Tabellenspalte oben 70px, Tabellenspalte unten 100px
und ich die Höhen der 2 Spalten der Mitte nicht angegeben habe,
reicht die Tabelle nicht genau vom obersten body-Rand bis
zum Untersten, wobei die Höhe der Header- und der
Eingabe-Spalte sich nicht ändern soll und die Spalten der
Mitte sich anpassen müssten.

Problem 2:

Zitat:

Zitat von jS-Konsole

Fehler: document.getElementById("log") has no properties
Quelldatei: test
Zeile: 8

Problem 3:
Wie bekomme ich das Input-Feld und den Button daneben
auf die selbe Zeilenhöhe? Der Button und das Textfeld
haben dieselbe height, doch der Button hängt irgendwie
paar Pixel höher als das input-Feld.

Und obwohl die Seite sowohl bei w3c als auch selfhtml
valides html 4.01 Transitional ist, wird sie im IE aber
anders dargestellt als im FF.
Der Button hängt im IE runter, im FF hoch.

Hoffe, mir kann hier wer helfen und bedanke mich
dann im Voraus.

P.S.: Könnte jemand meinen threadtitle korrigieren?