HTML Code im Internet Explorer & Firefox

Registriert
1. Dezember 2003
Reaktionspunkte
0
Ort
Köln
Hi,

ich habe nen kleines Problem.

Welche Änderungen im Quelltext muss ich eigentlich beim Firefox gegenüber dem IE beachten?

Hier mal nen Scriptauszug...

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

<html>
<head>
	<title>Untitled</title>
<link rel="stylesheet" type="text/css" href="./3w.css">
</head>

<body topmargin="0" rightmargin="0" leftmargin="0" bottommargin="0">

<table width="100%" height="100%" cellpadding="0" cellspacing="0" border="0">
	<tr>
		<td height="48%" class="bg_top"> </td>
	</tr>
	<tr>
		<td height="451">
		<table width="100%" height="451" cellpadding="0" cellspacing="0" border="0">
			<tr>
				<td width="48%" height="200" class="bg_top"> </td>
				<td width="613px" height="200" class="bg_top" align="center" valign="top"><img src="./images/3w_logo.jpg" border="0"></td>
				<td width="48%" height="200" class="bg_top"> </td>
			</tr>
			<tr>
				<td width="100%" height="29" colspan="3" class="bg_middle" align="center" valign="middle"><img src="./images/3w_header.jpg" border="0"></td>
			</tr>
			<tr>
				<td width="48%" height="200"> </td>
				<td width="613px" height="200" class="bg_top" align="center" valign="top"><img src="./images/3w_logo.jpg" border="0"></td>
				<td width="48%" height="200"> </td>
			</tr>
		</table>
		</td>
	</tr>
	<tr>
		<td height="48%"> </td>
	</tr>	
</table>

</body>
</html>

Im IE wird der mittlere Balken (3w_header.jpg) auch in der Mitte des Browserrahmens gezeigt. Im Firefox jedoch wird der Rahmen im unteren Drittel des Browserfensters gezeigt?

Warum? Was mache ich falsch und was muss ich im Firefox beachten?

Danke & Gruß

Stivn
 
[x] Du sollst nicht mit Tabellen layouten
[x] Du sollst table-Tags keine Hoehe geben, denn das ist in keinem Standard festgelegt.
[x] Du sollst CSS zur Gestaltung nutzen

Dein Frage ist uebrigens falsch gestellt, sie muesste lauten: Warum folgt der Internet Explorer beim Rendern nicht den Standards des W3C und stiftet zum schlampigen Erstellen von HTML-Seiten an?

rik
 
rikman schrieb:
[x] Du sollst nicht mit Tabellen layouten
[x] Du sollst table-Tags keine Hoehe geben, denn das ist in keinem Standard festgelegt.
[x] Du sollst CSS zur Gestaltung nutzen

Dein Frage ist uebrigens falsch gestellt, sie muesste lauten: Warum folgt der Internet Explorer beim Rendern nicht den Standards des W3C und stiftet zum schlampigen Erstellen von HTML-Seiten an?

rik

*hehe* Rikman, wie er leibt und lebt! :daumen:
 
rikman schrieb:
[x] Du sollst nicht mit Tabellen layouten
[x] Du sollst table-Tags keine Hoehe geben, denn das ist in keinem Standard festgelegt.
[x] Du sollst CSS zur Gestaltung nutzen

rik

[?] Womit sollte ich dann Layouten?
[?] Wohl war ;)
[?] Was soll ich am bisherigen Quelltext mit CSS verändern???
 
stivn.99 schrieb:
[?] Womit sollte ich dann Layouten?

Du legst die Strukur (Ueberschriften, Absaetze, Liste etc.) in einer HTML Datei fest und gibst dem ganzen mit CSS das Aussehen, sprich du "layoutest" mit CSS.

Tabellen sind dazu da, um Inhalte darzustellen, die man halt am besten in einer Tabelle darstellt (Telefonnummernverzeichnis oder was weiss ich), Tabellen sind nicht dazu da, um ein Layout zu erzeugen, das knallt naemlich irgendwann. Siehe dein IE/FF-Problem.

[?] Was soll ich am bisherigen Quelltext mit CSS verändern???

- alle Tables rausnehemen
- das gewuenschte Design aus DIV-Containern aufbauen, deren Aussehen, Position, Groesse usw. per CSS festgelegt wird.

Schaue dich mal hier um:

http://css4you.de/ - Abschnitt Workshops

rik
 
Eine Frage noch:

Mit welchem CSS Befehl erzwinge ich die Vertikale Ausrichtung nach unten? Die horizontale läuft ja über text-align:center etc...
Aber geht auch text-valign?

Danke schon mal!
 
Noch mal @ Rikman - den CSS-Und-Layer-Versteher ;)

Ich möchte gerne ein Layer ein- bzw. ausblenden lassen. Das ein- und ausblenden läuft auch ganz einfach.

Hier mal der Quellcode vom Layer:

Code:
<div id="klapptextRow_1" style="position:absolute; width:142px; height:115px; z-index:2; left:20px; border:0px solid #000000; top: 20px; display:none">
<a href="javascript:klapptext(1)"><img src="./images/ref_01.jpg" border="0" alt="Zum Schließen in das Bild klicken"></a>
</div>

Meine Frage ist nun wie ich den Layer immer mittig vom Browserfenster angezeigt und dieser dort bleibt auch wenn ich das Browserfenster größer bzw. kleiner ziehe. Denn momentan ist er ja links oben in die Ecke "gequetscht" was bei einigen Dingen allerdings nicht ganz so toll aussieht.

Ist es überhaupt möglich den Layer per einfachen Befehl mittig anzeigen zu lassen?

Ach ja, mir geht es nur um die horizontale ausrichtung. Die vertikale ist hier nebensächlich.
 
vertikal bekommt man es nicht hin, dass es bei jeder browsergröße da bleibt. macht man das fenster zu klein, verschwindet ein teil ohne scrollleiste - kommt man also nicht ran.

um etwas horizonal mittig zu machen margin:auto; nehmen

vertikal position:absolute;top:50%;margin-top:-??/2px;height:??px;

das vertikale könnte man auch auf horizontal umschreiben.
 
ich layoute meinen html output immer mit tabellen und bin damit stets gut gefahren!!

auch wenn das vielleicht nicht der "sauberste" weg zur seitenformatierung ist, kann ich damit doch mit 100%-iger sicherheit meine seiten so gestalten daß sie auf allen browsern auf den pixel genau gleich aussehen (von differenzen beim textrendering mal abgesehen)!!!!

gruesse, hannes
 
kann man per css auch. und du kannst auch layouts für drucken... anlegen.

was ist denn html überhaupt - schon mal darüber nach gedacht?

warum man keine tabellen nehmen sollte kannst du hier nachlesen.
 
jeder so wie er will!

ich halte es meistens so, daß ich mir das grundlayout der seite einmal mit einer tabelle fixiere, und danach die margins innerhalb der tabelle über css festschreibe.

es geht mir nur auf die nerven, wenn dogmatisch behauptet wird, "so macht man das aber nicht".
wenn heute der designer, der von der umsetzung leider oft wenig bis gar keine ahnung hat, mit einem entwurf vor dir steht, bleibt dir oft nichts anderes übrig, als auf tabellen zurückzugreifen (siehe "was mit css nicht machbar ist" auf der von dir angegebenen seite).

die behauptung, daß sich die gestaltung vom inhalt trennen ließe, halte ich auch nur für begrenzt haltbar. das gleiche wurde auch von xslt behauptet, und dort fand die meiste arbeit letzlich in der erstellung des stylesheets statt, und nicht in der erstellung des inhalts. um also das design der seite zu ändern, wäre wieder erheblicher aufwand nötig gewesen.
ausserdem, da viele seite ohnehin dynamisch generiert werden, schreibt man sich seine templates sowieso nur einmal. eine änderung des designs findet hier in der änderung des templates statt, ob das nun das ändern eines stylesheets bedeutet, oder das anpassen des im template enthaltenen html codes.

der vollständigkeit halber muss ich aber gestehen, daß ich seit ein paar jährchen fremd gehe (svg) und daher auch nicht mehr gar so viel mit html konfrontiert bin. ausserdem wurde das grundlayout der html seiten im immer noch aktuellen projekt vor mittlerweile 3 jahren entworfen und beinhaltet nun mal tabellen. wie ich heute meinem chef erklären soll, daß ich gerne die mittlerweile ca. 70000 zeilen jsp/html code überarbeiten möchte um standardkonform zu sein, kann ich mir nicht vorstellen.

grüsse, hannes
 
igorion schrieb:
es geht mir nur auf die nerven, wenn dogmatisch behauptet wird, "so macht man das aber nicht".
Nur der Technik wegen den "richtigen" Weg zu gehen, ist sicher übertrieben.
Es geht aber auch um die Barrierefreiheit. Blindenlesegeräte können keine Tabellen anzeigen. Falls diese Zeilgruppe uninteressant ist, ok, falls nicht, dann schau dir eine Tabellen-layoutete Seite mal mit dem Textbrowser Lynx an.

Daniel
 
igorion schrieb:
jeder so wie er will!
die behauptung, daß sich die gestaltung vom inhalt trennen ließe, halte ich auch nur für begrenzt haltbar.

das sehe ich genauso. will man layout und inhalt 100%ig trennen, muss man eben quellen wie datenbanken zu ziehen. nur html ist ja grundlegend eine textauszeichnungssprache und somit sollte eine überschrift eine überschrift sein, eine navigation z.b. eine liste... und eben keine tabelle. womal sich auch dafür argumente finden ließen. sicherlich ist css auch begrenzt in der layoutvariabilität, es ist aber handhabbarer als tabellen.

was ist svg? - man kann ja nicht alles wissen.

es hat eben alles so seine vor- und nachteile und was letztendlich den kunden/chef interessiert ist doch oftmals nicht das wie.
 
bikedoedel schrieb:
es hat eben alles so seine vor- und nachteile und was letztendlich den kunden/chef interessiert ist doch oftmals nicht das wie.

Das stimmt wohl.

Ich habe mir die Seite css4you.de mal angeschaut und fahre mit einer Mischung aus Tabellen und Div-Containern eigentlich sehr gut. Es funktioniert im IE wie im Firefox und genau das wollte ich. Ob es jetzt 100% konform ist sei dahingestellt - aber es läuft.
 
Hallo,
ich habe das erste Mal bei den Bikeshops tabellenlos layoutet:
Beispiel: http://www.mtb-news.de/fahrrad-haendler/s6-bike-mailorder.de.html

Es ist beim erstmaligen Einrichten eine Umstellung und ich habe mich auch verschiedener Vorlagen bedient. Danach finde ich es aber einfacher konformen Code generieren zu lassen, da man sich nicht mehr mit Tabellen rumschlagen muss. Das mit der Barrierefreiheit ist sicher ein grosser Vorteil, ich könnte mir vorstellen, das das auch die Findbarkeit in Suchmaschinen verbessern kann, wenn man dank CSS schlanken und einfachen Code verwenden kann. Der Seiteaufbau kann völlig anders sein als das was nachher dargestellt wird (siehe Lynx-Foto) - bspw hängt das Formular bei mir unten an der seite dran, wird aber mit CSS oben rechts positioniert

Ich nutze die Webdeveloper Extension für Firefox, da kann man CSS ausschalten oder sogar live editieren und es wird direkt neu gerendert - finde ich sehr praktisch...

Grüße
Thomas
 

Anhänge

  • lynx.gif
    lynx.gif
    9,3 KB · Aufrufe: 30
Zurück