Darstellungsprobleme

Status
Nicht offen für weitere Antworten.
L

lubino

Mitglied
Auch ich hab ein Darstellungsprobleme und vieleicht trennen mich nur 3 Pixel von einer sauberen Darstellung in allen Browsern.

Meine Seite http://www.lubino.de/index2.htm sieht derzeit nur im IE optimal aus, in Mozilla und Netscape rutscht alles ein bischen nach unten, vieleicht liegt das am Absatz?

ich benutze auch CSS damit das Layout in alles Browsern gleich ist
aber vieleicht ist der Hund auch im HTML begranen!

Code: 
body {
	font-size: 7pt;
	padding:20px;
	margin:0px;
	text-align: center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-color: #FFFFFF;
	color: #003399;
	top: 50%;
}
#inhalt {
	text-align: left;
	vertical-align: middle;
	margin: -245px auto 0px -400px;
	padding: 0px;
	width: 800px;
	height: 425px;
	left: 50%;
	top: 50%;
}

freu mich auf Eure Lösung weil ich echt nicht mehr weiter weis.
 
Vielleicht lösen die Fehlerkorrekturen das Darstellungsproblem:

Code: 
<div id="Layer1" style="position:absolute; width:128,000px; z-index:2; left: 676px; top: 37px;">

<div id="Layer1" style="position:absolute; width:10px; height:115px; z-index:2; left: 774px; top: 154px; ">
Zudem darf die ID Layer1 in einem Dokument nur einmal vergeben werden (!)

Anmerkung: der DHTML-Scroller funktioniert nicht in den Gecko-Browsers FireFox (1.5), Mozilla (1.6) und Netscape (7.0).
 
wie du sehen kannst hab ich jetzt überall die einheiten mit angegeben, sowie beim layer als auch bei den bidern und tabellen....aber in den anderen browsern ist es um 2-3 pixel alles verrutscht.
 
mach doch einfach eine CSS Weiche für den Internet Explorer rein:

if [IE], dann kannst du nämlich für den Internetexplorer ein eigenes Stylesheet bauen, und die anderen Browser anpassen.
 
Bei den Attributen width= und height= werden keine Einheiten angegeben (!)

Code: 
<img src="start.gif" name="Image3" width="93px" height="30px" border="0">

Im Stylesheet steckt auch noch ein Fehler:

Code: 
#divContent{
	position:absolute;
	top:34,000px;
	left:16,000px;
	width: 366px;
	height: 275px;
}

[editpost]

Die vertikale Verschiebung könnte auch am falschen margin-top -Wert liegen, der die negative Hälfte der Elementhöhe betragen muß, damit das Element im Browserfenster vertikal zentriert wird:
Code: 
#inhalt {
	text-align: left;
	vertical-align: middle;
	margin: -245px auto 0px -400px;
	padding: 0px;
	width: 800px;
	height: 425px;
	left: 50%;
	top: 50%;
}
Die negative Hälfte von height:425px ist nämlich -212.5px (!)

Korrigiertes Stylesheet
Code: 
#inhalt {
	text-align: left;
	vertical-align: middle;
	margin-left: -400px;
	margin-top: -212.5px;
	padding: 0px;
	width: 800px;
	height: 425px;
	position: absolute;
	left: 50%;
	top: 50%;
}
Anmerkung: da in deinem Quelltext mehrere Fehler bzw. Unstimmigkeiten stecken, lässt sich schwer sagen, welcher Fehler für das Darstellungsproblem verantwortlich ist.
 
Zuletzt bearbeitet von einem Moderator:
Scheinbar liegt es an der von dir verwendeten Dokumenttyp-Deklaration:

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Wenn ich stattdessen für das HTML-Dokument

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
bestimme, wird das Layout in den Gecko-Browsers FireFox (1.5), Mozilla (1.6) und Netscape (7.0) fehlerfrei, also ohne vertikale Verschiebungen angezeigt.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück