# HTML Darstellungsproblem



## The_S (16. Jul 2008)

Moin zusammen,

ich bin gerade am Verzweifeln und die Lösung ist vermutlich sehr einfach - nur ich bin in meiner Wut nicht in der Lage sie zu sehen  :x  :autsch: .

Ich habe (gekürzt) folgende HTML-Seite:


```
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html lang="de">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <head>
        <title>abas - Suchergebnisse</title>

        <base href="http://iavm01:8080/abashelp/de/">
        <script type="text/javascript">
            <!--
            function queryfocus() { document.search.query.focus(); }
            -->
        </script>
	  <style type="text/css">
	  div.line {
		position: relative;
		width: 100%;
		height: 7px;
		background-color: rgb(0, 141, 149);
		line-height: 0px;
		font-size: 1px;
	  }
	  label.head {
		font-family: Verdana;
		font-size: medium;
		font-weight: bold;
		text-align: center;
		width: 100%;
		display: block;
	  }
	  table.srch {
		font-family: Verdana;
		font-size: small;
		font-weight: bold;
		width: 100%;
	  }

	  </style>	

    </head>

<body onLoad="queryfocus();">

[img]/images/logo.bmp[/img]



<div class="line"></div>


<label class="head">Suche in der abas-ERP Hilfe</label>

<form name="search" action="../s" method="get">

<table border="0" class="srch">
	<colgroup>
		<col width="180">
		<col>
	</colgroup>
	<tr>
		<td>Suche nach: <td>
		<td><input width="100%" name="query" type="text" value=""></td>
	</tr>
	<tr>
		<td>[url="help.html"]Hilfe[/url]</td>
		<td><input type="submit" value="Suche"></td>
	</tr>
</table>

</form>

Treffer [b]0-0[/b] (von insgesamt 0 gefundenen Seiten):

</body>
</html>
```

Kann mir mal bitte irgendjemand erklären, warum:

1.) Die Schrifgröße in der Tabelle beim IE dieselbe ist, wie bei der Überschrift (Firefox funktioniert alles)
2.) Das Query-Textfeld mitten im Bildschirm und garantiert nicht 100% breit erscheint?

Das wars auch schon, danke!

(Mit dem scheiß mach ich jetzt schon seit über 2 Stunden rum, ich werd noch wahnsinnig! Dadurch kann es auch sein, dass unter Umständen Schwachsinn im HTML-Code steht  )


----------



## The_S (17. Jul 2008)

Nächste Frage:

Warum zeigt das hier jetzt alles richtig an (ein paar attribute verändert und in der zweiten Zeile ein zusätzliches TD eingefügt)?


```
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html lang="de">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <head>
        <title>abas - Suchergebnisse</title>

        <script type="text/javascript">
            <!--
            function queryfocus() { document.search.query.focus(); }
            -->
        </script>
	  <style type="text/css">
	  div.line {
		position: relative;
		width: 100%;
		height: 7px;
		background-color: rgb(0, 141, 149);
		line-height: 0px;
		font-size: 1px;
	  }
	  label.head {
		font-family: Verdana;
		font-size: medium;
		font-weight: bold;
		text-align: center;
		width: 100%;
		display: block;
	  }
	  table.srch {
		font-family: Verdana;
		font-size: small;
		font-weight: bold;
		width: 100%;
	  }

	  </style>	

    </head>

<body onLoad="queryfocus();">

[img]/images/logo.bmp[/img]



<div class="line"></div>


<label class="head">Suche in der abas-ERP Hilfe</label>

<form name="search" action="../s" method="get">

<table border="0" class="srch">
	<tr>
		<td nowrap>Suche nach: <td>
		<td style="width: 100%;"><input size="40" style="width: 100%;" name="query" type="text" value=""> </td>
	</tr>
	<tr>
		<td>[url="help.html"]Hilfe[/url]</td>
		<td> </td>
		<td><input type="submit" value="Suche"></td>

	</tr>
</table>

</form>

Treffer [b]0-0[/b] (von insgesamt 0 gefundenen Seiten):

</body>
</html>
```

Das Schriftgrößen Problem im IE existiert aber weiterhin :cry: .

Hat wirklich keiner ne Idee? Ich hab scho an meinem Verstand gezweifelt ...

Danke!


----------



## Gelöschtes Mitglied 6946 (17. Jul 2008)

```
<td nowrap>Suche nach: <td>
```
Fällt dir was auf?
Wenn du das gefixt hast, kannst du auch die sinnlose Zelle aus der zweiten Zeile rausnehmen.

"small" ist eine Angabe, die jeder Browser eben anders interpretiert - Opera und Internet Explorer stellen diese Angabe relativ "groß" dar, während Firefox das Ding kleiner macht. Wenn du "x-small" verwendest, wird es überall entsprechend kleiner. Du könntest die Angabe also entweder etwas konkreter machen (in Form von em z.B.) oder du verwendest "smaller" - das bezieht sich dann auch auf die Schriftgröße des Elternelements (wie Angaben in em) und es sieht mit allen drei Browsern halbwegs gleich aus.

Dann möcht ich noch ein wenig über deinen HTML-Code meckern, wenn ich schonmal dabei bin  Ein div als Linie zu missbrauchen, ist irgendwie Quark. Das selbe kannst du auch über border-top erreichen (wo es sich anbietet) oder aber hr verwenden. Das "position: relative;" scheint mir da auch ohne Funktion. Label-Tags kommen theoretisch übrigens ausschließlich IN Formularen vor und zwar immer in Verbindung mit einem Eingabefeld (input jeglicher Art oder textarea). Wenn du eine Überschrift machen willst, dann verwende am besten ein Überschrifts-Tag (h1-h6). Und darüber, dass man Tabellen nicht missbrauchen sollte, lass ich mich jetzt mal nicht aus - und für den Nutzer macht das ja, genauso wie meine anderen Meckereien, am Ende vermutlich eh keinen unterschied.

Ich hoffe, ich konnte helfen


----------



## The_S (18. Jul 2008)

ex'ratt hat gesagt.:
			
		

> ```
> <td nowrap>Suche nach: <td>
> ```
> Fällt dir was auf?



Oh verdammt, danke. Ich hab alles 20 mal überprüft, aber irgendwann sieht man den Wald vor lauter Bäumen nicht mehr 



			
				ex'ratt hat gesagt.:
			
		

> "small" ist eine Angabe, die jeder Browser eben anders interpretiert - Opera und Internet Explorer stellen diese Angabe relativ "groß" dar, während Firefox das Ding kleiner macht. Wenn du "x-small" verwendest, wird es überall entsprechend kleiner. Du könntest die Angabe also entweder etwas konkreter machen (in Form von em z.B.) oder du verwendest "smaller" - das bezieht sich dann auch auf die Schriftgröße des Elternelements (wie Angaben in em) und es sieht mit allen drei Browsern halbwegs gleich aus.



Danke für den Hinweis. Ich habe leider den Fehler begangen, dass ich die Schriftgrößen nicht direkt nebeneinander betrachtet habe, sondern nur mit etwas Abstand untereinander => und da sehen sie dann komplett identisch aus (zumindest aus meiner Sicht). Deshalb bin ich fälschlicherweise davon ausgegangen, dass der IE diese Angabe einfach ignoriert. Habs jetzt mit 0.8em gelöst, schaut perfekt aus, danke  .



			
				ex'ratt hat gesagt.:
			
		

> Dann möcht ich noch ein wenig über deinen HTML-Code meckern, wenn ich schonmal dabei bin



Gerne, ich leide es an meinen lieben Kollegen weiter, der diesen HTML-Code (und noch viel mehr) verbrochen hat. Bin nämlich gerade dabei das Ganze ein wenig umzustrukturieren.



			
				ex'ratt hat gesagt.:
			
		

> Ich hoffe, ich konnte helfen



Sehr, nochmals vielen Dank


----------

