Probleme mit Css und Homepage

Status
Nicht offen für weitere Antworten.

vanitas

Grünschnabel
hallo,

ich habe ein klitzekleines, nee eigentlich ein verdammt großes problem mit meiner page

http://aprilchild.pytalhost.com/

meine html-kenntnisse sind halbwegs eingerostet, da ich shcon lang nix mehr gemacht habe und an css habe ich mich ganz langsam herangewagt, hat auch soweit ganz gut geklappt, aber wnen ich die page mir anschaue, sieht sie nur im opera fast so aus, wie ich sie haben will. im IE und im firefox hingegen gibts einige probleme. zum beispiel ist das navigationfeld verschoben, der header prangt etwas über den rest etc.

könnte mir vielleicht jemand helfen und mir meine fehler aufzeigen?
ich bin etwas blind und seh die selbst nicht -.-
zudem würde ich gern das ganze zentriert haben.

dake schon mal für eure mühe und antworten.

und ja ich bin ein neuling, aber es is noch kein meister vom himmel gefallen :(
 
So schlimm scheint das Ganze ja doch nicht zu sein.

Zuerst benötigt das Dokument eine ordentliche Dokumenttyp-Deklaration (auch DOCTYPE genannt), damit der Browser überhaupt weiß, um welche HTML-Version es sich handelt. Da empfehle ich dir sie Strict-Version, dessen DOCTYPE wie folgt lautet und an den Anfang des Dokuments gehört:
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
	"http://www.w3.org/TR/html4/strict.dtd">
…
Dann muss nur noch eine klitzekleine Änderung vorgenommen werden, damit das Dokument SGML-konform ist, und zwar die XML-konforme Deklaration des leeren link-Elements mit dem schließenden Schräglich am Ende im Start-Tag, der in HTML nichts zu suchen hat. Also:
HTML:
<link rel="stylesheet" type="text/css" href="style.css">
Nun noch dem img-Element ein alt-Attribut hinzugefügt und schon haben wir ein valides HTML-Dokument. Dazu kommt der gesamte Inhalt des body-Elements noch zusätzlich in ein div-Element mit der ID „container“, damit das Ganze später zentriert dargestellt werden lann.

Nun zum Stylesheet: das alte kommt erst mal raus. Hier das neue:
Code:
body {
	margin: 0;
	padding: 0;
	text-align: center;
	color: #102c19;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 12px;
	background-image: url(img/bg.jpg);
}
#container {
	width: 598px;
	margin: 20px auto 0 auto;
	text-align: left;
	border: 1px solid #3e3c3c;
	background-color: #eaeaea;
}
#header {
	border-bottom: 1px solid #3e3c3c;
}
#header img {
	display: block;
}
#navbar {
	padding: 5px 10px;
	color: #1c281e;
	font-size: 11px;
	font-weight: bold;
} 
#content {
	padding: 10px 1ex;
}

a:link {
	color: #1c281e;
	text-decoration: none;
}
a:visited {
	color: #1c281e;
	font-style: italic;
	text-decoration: none;
}
a:hover {
	color: #27422C;
	text-decoration: underline;
}
a:active {
	color: #27422C;
	text-decoration: underline;
	font-style: italic;
}
Für Erklärungen bin ich gerade etwas zu faul.
 
ui, danke für die schnelle antwort :)

stimmt, wah wieso vergesse ich den doctype :-(

ich werds mal ausprobieren, ich denke mal, das ist selbsterklärend und wenn ichs nich hinkriege muss ich nochmal sekundärliteratur lesen, dami ichs kapier, aber ich dneke, ich dürfte das auch so verstehen.

danke nochmal:)
 
Status
Nicht offen für weitere Antworten.
Zurück