zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden IE6 zeigt Seite falsch an, IE7, FF und Opera machen es richtig

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 10.09.2007, 22:07
Benutzerbild von ThorstenSt
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 14.08.2005
Beiträge: 47
ThorstenSt befindet sich auf einem aufstrebenden Ast
Standard IE6 zeigt Seite falsch an, IE7, FF und Opera machen es richtig

Hallo, habe ein kleines Berufsschulprojekt am laufen, und gestallte grade dazu die Webseite.

Soweit so gut, ich habe auf meinem Hostsystem folgende Browser installiert:

IE 7, FireFox 1.5.0.12, und Opera 9.10

und auf einer VirtuellenMaschine noch einen IE 6 mit SP2

Die oben drei genannten Browser zeigen die Darstellung der Webseite korrekt an, außer mit Abweichungen der Opera, aber das wird wohl nur an einem fehlenden float oder sontigem hängen, nicht weiter schlimm.

Sehr wüst ist jedoch die Anzeige der Seite im IE6

Habe einiges versucht um dieses grade zu biegen, jedoch weiß ich nun nicht, ob es am CSS oder am HTML Doctype liegt.

Ich habe einfach mal ausprobiert und den Doctype aus der HTML Datei genommen, und IE 7, FireFox und Opera

zeigten nun die Webseite genauso an wie im IE6 auf der VM.

Könnte ihr mir einen rat geben? Hier nochmal ein wenig Code und Screenshots im Anhang:

Danke schonmal
Gruß Thorsten

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html> 
<head>
<title>CD-DVD Web</title>


<link rel="stylesheet" type="text/css" href="css/cdweb_style.css" />
<link rel="stylesheet" type="text/css" href="css/loginBereich.css" />
<link rel="stylesheet" type="text/css" href="css/menue.css" />

</head>
<body>

<div id="header">
			
			<div id="statusMeldung">
				<div id="loadingMessage" style="display: none;width:100%;"></div>
        	</div>	
</div>

<div id="cdwebLogo"></div>
		
		<div id="loginBereich">
			<div id="loginBereichText">
		 <form id="login" name="login" action="" onSubmit="return false;">					
		<p>Benutzer: <input class="benutzer" id="login_benutzer" name="login_benutzer" type="text" /> </p>
		<p>Passwort: <input class="passwort" id="login_passwort" name="login_passwort" type="password" /> </p>
		</div>
			<div id="loginBereichButton"><input class="login_button" type="button" id="login_button" name="login_button" value="LogIn" /></div>	
			</form>
		</div>

		<div id="menue">	
		<ul>
		<li><a href="index.php"><img src="images/menue_start.gif" style="margin-left:2px;" alt="Startseite" />Startseite</a></li>
			<li><a href="administration.php"><img src="images/menue_admin.gif" style="margin-left:2px;" alt="Administrationsbereich" />Administration</a></li>
			<li><a href="musikarchiv.php"><img src="images/menue_musik.gif" style="margin-left:2px;" alt="Musikarchiv"  />Musikarchiv</a></li>
			<li><a href="filmarchiv.php"><img src="images/menue_dvd.gif" style="margin-left:2px;" alt="Filmarchiv"  />Filmarchiv</a></li>
			<li><a href="gaestebuch.php" ><img src="images/menue_gb.gif" style="margin-left:2px;" alt="Gaestebuch"  />G&auml;stebuch</a></li>
			</ul>
			</div>
			
			<div id="seitentitel">

<img class="titelbild" src="images/startseite.gif" alt="Startseite" />  <p class="titel">Startseite</p>

</div>

<div id="hauptBereich">
        
        fg sgdfgsfd gdsfg dsf
           
         		</div>
		
		<div id="footer">&copy; 2007 by Thorsten Steinberg</div>
</body>
</html>
cdweb_style.css
Code:
*{
   margin:0px;
   padding:0px;
}

html
{
 	height:100%; 
	width:100%;	 
	margin:0px;
    padding:0px;
}

body
{
	margin:0px;
    padding:0px;
	width:100%;
	height:100%;
	background-color: #666666;
}


#statusMeldung
{
 	position: absolute;
 	padding:0px;
 	top: 10px;
 	left:280px; 
 	height: 28px;
	width: 525px;
	margin:0px;
	font-family: Verdana, Helvetica, Arial, sans-serif;
  	font-size: 10pt;
  	color:#ffffff;
	z-index: 4;

}

#statusMeldung p
{
 	margin-top: 5px;
 	margin-left: 33px;
	font-family: Verdana, Helvetica, Arial, sans-serif;
  	font-size: 9pt;
  	color:#ffffff;
}

#statusMeldung img
{
 	float:left;
 	margin:0px;
 	padding:0px;
}

#cdwebLogo
{
	position:absolute;
	top:2px;
	left:0px;
	width:248px;
	height:103px;
	background-image: url('../images/cdWebLogoLeft.jpg');
	background-repeat: no-repeat;
	z-index:1;
}


#hauptBereich
{
	position: absolute;
	overflow: auto;
	left:21px;
	right:85px;
	top: 138px;
	bottom: 30px;
	width: auto;
	height: auto;
	border-right:1px solid #000000;
	background-color: #ffffcc;
	background-image: url('../images/border_left.jpg');
	background-repeat: repeat-y;
	margin-top:0px;
	padding-top:4px;
	padding-left:20px;
	padding-right:20px;
	z-index:0;
}

#footer
{
 	position:absolute;
 	text-align:right;
	width: auto;
	bottom:11px;
	height: 19px;
	background-color: #ffffcc;
	border-right:1px solid #000000;
	left:21px;
	right:85px;
	background-image: url('../images/footer.jpg');
	background-repeat: no-repeat;
	padding-left:20px;
	padding-right:20px;
	font-family: Verdana, Helvetica, Arial, sans-serif;
  	font-size: 7pt;
  	font-weight: bold;
}

#seitentitel .titel{
    
    display:block;
	padding-left:8px;
	margin:0px;
 	text-align:left;
    color: #000000;
	border-bottom: 1px solid #000000;
	font-family: Verdana, Helvetica, Arial, sans-serif;
  	font-size: 16pt;
  	font-weight: bold;
}

#seitentitel img.titelbild{
    
    float:left;
	margin-left: 10px;
	margin-right: 8px;
	margin-top: 3px;
	margin-bottom: 0px;
	padding: 0px;
	border:0px;
}

#seitentitel
{
	position:absolute;
	
	top: 105px;
	left:21px;
	right:85px;
	height:auto;
	border-right:1px solid #000000;
	background-color: #ffffcc;
	background-image: url('../images/border_left.jpg');
	background-repeat: repeat-y;
	margin-top:0px;
	padding-left:20px;
	padding-right:20px;
	z-index:5;
}
menue.css
Code:
/* CSS-Style für die Menüs */

/* Stylesheets für das Hauptmenü der Seite  */

#menue
{
	position: absolute;
	float:left;
	padding:0px;
	right:85px;
	left:242px;
	width: auto;
	height:60px;
	top: 45px;
	border-right:1px solid #000000;
	background-color: #ffffcc;
	background-image: url('../images/border_top.jpg');
	background-repeat: repeat-x;
	z-index:2;
}

#menue img{
 	
 	float:left;
	margin-top: 0px;
	margin-right: 4px;
	margin-bottom:0px;
	border:0px;
}

#menue ul{
  
  margin-top:12px;
  margin-left:0px;
  padding: 0px;
  font-family: Verdana, Helvetica, Arial, sans-serif;
  font-size: 10pt;
  list-style-type: none;
  height: 100%;
  
}

#menue ul li{
 
  display: block;
  float: left;
  text-align: left;
  margin-left:10px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 0px;
  
}

#menue ul li a{
 
  display: block;
  margin-top:0px;
  border-top: 4px solid #cccccc;
  height: auto;
  width: 130px;
  color:#000000;
  padding-top:2px;
  text-align:center;
 
}

#menue ul li a:link, a:visited{
 
  color: #000000;
  text-decoration: none;
  
}

#menue ul li a:hover{
  
  border-top: 4px solid #666666;
 
  color: #000000;
  font-weight:normal;
  text-decoration: none;

}

und die loginBereich.css

Code:
#loginBereich
{
 	position:absolute;
 	right:15px;
 	top:10px;
	width:223px;
	height:92px;
	background-image: url('../images/loginBereich.jpg');
	background-repeat: no-repeat;	
	z-index:3;
}

#loginBereichText
{
	font-family: Verdana, Helvetica, Arial, sans-serif;
    font-size: 9pt;
    margin-left:12px;
    margin-top:10px;
}

#loginBereich input.benutzer
{
 	margin-top:10px;
 	background-image: url('../images/user.gif');
	background-position:right;
	background-repeat: no-repeat;
}

#loginBereich input.passwort
{
 	margin-top:2px;
 	margin-left: -2px;
 	background-image: url('../images/key.gif');
	background-position:right;
	background-repeat: no-repeat;
}

#loginBereich input.benutzer, .passwort
{
	font-family: Verdana, Helvetica, Arial, sans-serif;
    font-size: 8pt;
    border: 1px solid #000000;
    padding-top: 2px;
    padding-left: 2px;
    width: 130px;
	height: 15px;
	background-color: #ffffff;
}

#loginBereichButton input.login_button
{
	background-image: url('../images/go.gif');
}

#loginBereichButton input.logout_button
{
	background-image: url('../images/menue_logout.gif');
}

#loginBereichButton input.logout_button, .login_button
{
	float:left;
	width: 100px;
	height: 21px;
	border: 1px solid #000000;
	background-color: #cccccc;
	background-position:1px 1px;
	background-repeat: no-repeat;
	font-family: Verdana, Helvetica, Arial, sans-serif;
    font-size: 9pt;
    font-weight: bold;
}

#loginBereichButton
{
	position:absolute;
	right:10px;
	bottom: 6px;
	width: 100px;
	height: 21px;
}
Angehängte Grafiken
Dateityp: jpg ff_1_5_0_12.jpg (14,7 KB, 5x aufgerufen)
Dateityp: jpg ie_7.jpg (15,9 KB, 4x aufgerufen)
Dateityp: jpg ie6.jpg (23,3 KB, 7x aufgerufen)
Dateityp: jpg opera_9_10.jpg (14,1 KB, 3x aufgerufen)
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Im FF und Opera ok, im IE6 und IE7 falsch Werner CSS 0 09.12.2009 18:09
Fehlendes(?) oder falsch positioniertes Hintergrundbild in IE6 und IE7 shredder01 CSS 4 28.11.2009 20:38
Job: Optimierung einer Seite für den IE6 Revilo Offtopic 1 02.04.2009 17:44
Problem mit einbinden von Dropdown-Navigation in Seite... epsylon2 CSS 4 28.03.2009 23:25
Problem mit IE6 - mit FF2 und IE7 alles OK! bluescreen Site- und Layoutcheck 0 06.09.2007 23:09


Alle Zeitangaben in WEZ +2. Es ist jetzt 14:35 Uhr.