[HTML PROBLEM] Cross Browser Testing

    Hallo,
    ich soll für eine befreundete Gastronomin eine Webseite erstellen. Alles schön und gut, wenn da nicht der Internet Explorer wäre... Ich zeige es am besten mal anhand von Bildern:


    [tabmenu]

    [tab=Google Chrome]
    [tab=Firefox]
    [tab=Internet Explorer]
    [/tabmenu]


    Ich habe es immer hin schon mal mittig zentriert bekommen, indem ich den Dokumententyp verändert habe. Wer von euch kennt Tricks und Kniffe, damit der Internet Explorer arbeitet, wie ich das möchte? Also was muss man beachten?


    Freundliche Grüße,
    Matti

    Zitat von Nikolas-Mrak

    Der IE macht immer spacken, ich kenne das Problem. Aber ohne Code wird dir hier glaube ich keiner sagen können was du umändern musst. ^^


    index.html

    HTML
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>	<head>		<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">		<title>Webdesign</title>		<link rel="stylesheet" type="text/css" href="style.css" />		<link href="http://fonts.googleapis.com/css?family=Arvo" rel="stylesheet" type="text/css" />	</head>	<body>	<div id="menu">		<a href="#">Startseite</a> | <a href="#">Speisekarte</a> | <a href="#">Anfahrt</a> | <a href="#">Kontakt</a> | <a href="#">Impressum</a>	</div>	<div id="content">		<span style="font-size: 2em; text-shadow: #fff 1px 1px 20px;">Startseite</span><br>		<div id="inhalte">			Das ist der Inhalt der Seite		</div>	</div>	</body></html>

    index.html


    CSS Datei

    Code
    body{	font-family: 'Arvo', serif;	background: url(Bilder/bg.jpg) no-repeat center center fixed; 	-webkit-background-size: cover;	-moz-background-size: cover;	-o-background-size: cover;	background-size: cover;	height: 100%;	width: 100%;}#menu{	text-align: center;	z-index: 80;	position: fixed;	width: 100%;	top: 20px;	overflow: hidden;	color: #ffffff;	margin-left: -8px;	padding: 7px;	background-color: #000000;	filter: Alpha(opacity=50);	opacity: 0.5;}#content{	margin-top: 75px;	float: left;	position: fixed;	right: 25px;	height: 100%;}#inhalte{	background-color: #ffffff;	width: 500px;	padding: 10px;	filter: Alpha(opacity=50);	opacity: 0.75;	-webkit-border-radius: 5px;	-moz-border-radius: 5px;	border-radius: 5px;	height: 100%;}a{	text-decoration: none;	color: #ffffff;}a:hover{	color: #007eff;	text-decoration: none;}

    CSS Datei

    Bei CSS 2.0 bleiben, solange es der Standard ist und mit Gridlayout arbeiten. Dann kann selbst der IE dich nicht mehr in den Wahnsinn treiben ;)

    Twitch.tv/LeijaT


    Mein CS:GO Server: 62.75.168.39:27016


    Ich bin so hungrig, dass ich vor lauter Durst nicht weiß, was ich rauchen soll - so müde bin ich!
    Freedom is just another word for 'Nothing left to lose'

    Falls du noch probleme hast, warum machst du keine extra IE Anpassung ?
    Überprüf mit welchen Browser der Benuter "arbeitet" und lass ihn dann die CSS, Laden die er benötigt für chrome und firefox die wo du momentan hast, internet explorer einfach ne andere , dies kannst du in PHP aufjedenfall lösen ich denke dafür gibt es auch genug Examples (browsererkennung)