[Hilfe] Webseite wird von Browsern nicht richtig angezeigt - DreamWeaver

Jonas_93 · 07/01/2012, 20:22

Hallo zusammen!

Bin seit ein paar Tagen dabei mir html und css anzueignen.
Bin gerade dabei die erste Website zu basteln und stoße auf mir unerklärliche Probleme. Ich arbeite mit dem Dreamweaver und bekomme in ihm die Seite komplett und richtig angezeigt. In Browsern sieht das jedoch ganz anders aus.

In Chrome bekomm ich die komplette Seite außer den Div Container "Pictures" angezeigt.
Und in FF und im IE sieht man lediglich die 5 Labels.

Vielleicht wäre jemand so nett und würde mal ein Auge auf meine Codes werfen.
Freue mich auf jede Antworte und bedanke mich schon mal im Voraus!

Hier einmal die .html:

Code:

<html>
<head>
	<title>Webseite</title>
	<link rel="stylesheet" type="tect/css" href="design.css">
</head>
<body>
	<div id="website">
		<div id="headPictures">
		</div>

		<div id="mid">

			<div id="leftGraphic">
			</div>

			<div id="menue">
                		<p id="Home">| Home</p>
                		<p id="Vita">| Vita</p>
                		<p id="Aktuell">| Aktuell</p>
                		<p id="Projekte">| Projekte</p>
                		<p id="Impressum">| Impressum</p>
			</div>
		</div>
		
		<div id="content">

			<div id="pictures">
			</div>

			<div id="footer">
			</div>	
	
		</div>	 

	</div>
</body>
</html>

und die .css:

Code:

body {
background-color:#FFB991;
test-align:center;
}

#website {
width:850px;
margin:0 auto;
}

#headPictures {
width:850px;
height:130px;
background:#F56415;
}

#mid{
width:850px;
}

#menue {
float:right;
width:485;
height:215;
background-image:url(menue.gif);
}

#leftGraphic {
float:left;
width:365px;
height:215px;
background-image:url(leftGraphic.gif);
}

#content {
width:850px;
}

#pictures {
width:850px;
height:180px;
background-image:url(pictures.gif);	
}

#footer {
width:850px;
height:125px;
background-image:url(footer.gif);	
}

p#Home {
	float:left;
	margin-left:50px;
	margin-top:17px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:700;
	color:#FFB789;
}

p#Vita, p#Aktuell, p#Projekte, p#Impressum {
	float:left;
	margin-left:20px;
	margin-top:17px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:700;
	color:#FFB789;
}

Mfg Jonas

マルコ · 07/01/2012, 21:23

danach mal mit Chrome die Elemente überprüfen.
Wenn du HTML5 benutzt, empfehle ich außerdem Boilerplate.

Jonas_93 · 07/01/2012, 21:50

hab diese Sitevalidation mal ausprobiert uns außer dem fehlenden Doctype, den ich danach eingefügt hab, hat es mir nichts angezeogt.
Ich denke das liegt auch direkt am Code :S

Jemand noch ne idee ?

Mikesch01 · 07/02/2012, 18:09

Hast du vll einen Link zur Webseite? Das geht für viele dann leichter sich das vorzustellen.

.Acu³ · 07/02/2012, 18:51

Mach mal in die Container Leerzeichen rein, zumindest bei älteren FF Versionen wurden vermeintlich leere Container deshalb nicht angezeigt.

Code:

<div id="pictures">&nbsp; </div>
<div id="footer">&nbsp; </div>