✔ Firefox & IE

Dr_Google · 30. August 2005

Hallo, ich habe eine homepage unter firefox designt und musste feststellen das unter IE alles verzogen war bzw falsch dargestellt wurde.

Habt Ihr vielleicht ein paar gute tipps wie man sowas verhinder kann?

Beste Grüsse

AKrebs70 · 30. August 2005

Hallo!

Mehr Infos währen nicht schlech. Z.B. der Quelltext.

Axel

Dr_Google · 30. August 2005

Code:

/* Bereiche */

body, p a  
{
    color: black; 
    background-color: #FFFFFF;
    
   

}


.row0 
{
		background-color: #F5F5F5;
}




.row1 
{

		background-color: #F0F8FF;
}




h1#Kopfzeilea 
{
    position:absolute;
		font-size: 24px;
    top:60px;
		left:15px;
		width: 18em;
    margin:0px;
    padding: 0;
    text-align: center;
    background-color: #FFFFFF; 
    
}

html>body h1 
{
    border-color: black;  /* Farbangleichung an den Internet Explorer  */
}


div#Navigation h4 
{
    margin: 0.2em 0.5em;
}

div#Navigation p 
{
    margin: 0.5em;
}
  

div#navigationsmenu 
{
    position:absolute;
		top:7000px;
		left:300px;
		font-size: 0.83em;
    width: 18em;
    margin:0px;
    padding: 0;
    background-color: #FFFFFF; 
    border: 1px solid #BBBBBB;

}




/*-------------Style für den Anmeldebereich-----------------------*/
div#titel p 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
		font-size: 12px;
		font-weight:600;
		color: #D3D3D3;
		margin: 0.5em;
	  padding-top:0px;
}

div#titel 
{
    position:absolute;
		top:123px;
		left:300px;
		font-size: 0.83em;
    width: 30.78em;
    padding-top:0px;
	  padding-right:10px;
    background-color: #F5F5F5; 
    border: 1px solid #BBBBBB;

}




div#login p 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
		font-size: 10px;
		font-weight:600;
		color: #D3D3D3;
		margin: 0.5em;
	  padding-top:0px;
}

div#login 
{
    position:absolute;
		top:150px;
		left:300px;
		font-size: 0.83em;
    width: 20.2em;
    margin:0px;
    padding-left:150px;
	  background-color: #FFFFFF; 
    border: 1px solid #BBBBBB;

}



div#gifcaution 
{
    position:absolute;
		top:50px;
		left:30px;
		font-size: 0.83em;
    width: 2em;
    padding-top:0px;
	  padding-right:10px;
   
    border: 0px solid #BBBBBB;

}




div#titelhinweis 
{
    position:absolute;
		top:25px;
		left:300px;
		font-size: 0.83em;
    width: 30.78em;
    padding-top:0px;
	  padding-right:10px;
    background-color: #F5F5F5; 
    border: 1px solid #BBBBBB;

}

div#titelhinweis p 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
		font-size: 12px;
		font-weight:600;
		color: #D3D3D3;
		margin: 0.5em;
	  padding-top:0px;
}

div#hinweis 
{
    position:absolute;
		top:52px;
		left:300px;
		font-size: 0.83em;
    width: 30em;
    margin:0px;
    padding:10px;
    text-indent:20px;
		background-color: #FFFFFF; 
    border: 1px solid #BBBBBB;

}


input, textarea 
{
	border:1px solid #D3D3D3;
	padding-left:5px; 
	padding-top:2px;
	height:20px;
	font-size : 10px;
	color:#000000;
	font-family : Verdana, Arial, Helvetica, sans-serif;
}

/*-------------Style für den Index1.php Bereich -----------------------------*/
div#titelindex1 p 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
		font-size: 12px;
		font-weight:600;
		color: #D3D3D3;
		margin: 0.5em;
	  padding-top:0px;
}

div#titelindex1 
{
    position:absolute;
		top:123px;
		left:300px;
		font-size: 0.83em;
    width: 30.78em;
    padding-top:0px;
	  padding-right:10px;
    background-color: #F5F5F5; 
    border: 1px solid #BBBBBB;

}

div#index1 p 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
		font-size: 10px;
		font-weight:600;
		color: #D3D3D3;
		margin: 0.5em;
	  padding-top:0px;
}

div#index1 
{
    position:absolute;
		top:150px;
		left:300px;
		font-size: 0.83em;
    width: 30em;
    margin:0px;
    padding:10px;
  
		background-color: #FFFFFF; 
    border: 1px solid #BBBBBB;

}

/*-------------Style für den indexadmin.php Bereich -----------------------------*/

div#titeladmin p 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
		font-size: 12px;
		font-weight:600;
		color: #D3D3D3;
		margin: 0.5em;
	  padding-top:0px;
}

div#titeladmin 
{
    position:absolute;
		top:123px;
		left:300px;
		font-size: 0.83em;
    width: 40.8em;
    padding-top:0px;
	  padding-right:10px;
    background-color: #F5F5F5; 
    border: 1px solid #BBBBBB;

}

div#admin p 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
		font-size: 10px;
		font-weight:600;
		color: #D3D3D3;
		margin: 0.5em;
	  padding-top:0px;
}

div#admin 
{
    position:absolute;
		top:150px;
		left:300px;
		font-size: 0.83em;
    width: 37.8em;
    margin:0px;
    padding-left:50px;
  
		background-color: #FFFFFF; 
    border: 1px solid #BBBBBB;

}
/* bilder positionieren  */
div#gifdatastore 
{
    position:absolute;
		top:15px;
		left:20px;
	  width: 0em;
    margin:0px;
    border: 0px solid #BBBBBB;

}

div#gifdatastore1 
{
    position:absolute;
		top:55px;
		left:20px;
	  width: 0em;
    margin:0px;
    border: 0px solid #BBBBBB;

}

div#gifdatastore2 
{
    position:absolute;
		top:95px;
		left:20px;
	  width: 0em;
    margin:0px;
    border: 0px solid #BBBBBB;

}

div#gifdatastore3 
{
    position:absolute;
		top:95px;
		left:20px;
	  width: 0em;
    margin:0px;
    border: 0px solid #BBBBBB;

}

div#gifdatastore3 
{
    position:absolute;
		top:135px;
		left:20px;
	  width: 0em;
    margin:0px;
    border: 0px solid #BBBBBB;

}


div#gifflowgraph 
{
    position:absolute;
		top:170px;
		left:20px;
	  width: 0em;
    margin:0px;
    border: 0px solid #BBBBBB;

}

div#gifdocumentmag 
{
    position:absolute;
		top:205px;
		left:20px;
	  width: 0em;
    margin:0px;
    border: 0px solid #BBBBBB;

}

div#gifdocumentmag1 
{
    position:absolute;
		top:240px;
		left:20px;
	  width: 0em;
    margin:0px;
    border: 0px solid #BBBBBB;

}


div#gifusers 
{
    position:absolute;
		top:280px;
		left:20px;
	  width: 0em;
    margin:0px;
    border: 0px solid #BBBBBB;

}

div#gifrotcwright 
{
    position:absolute;
		top:320px;
		left:20px;
	  width: 0em;
    margin:0px;
    border: 0px solid #BBBBBB;

}


div#gifkey 
{
    position:absolute;
		top:360px;
		left:20px;
	  width: 0em;
    margin:0px;
    border: 0px solid #BBBBBB;

}



div#gifexit 
{
    position:absolute;
		top:400px;
		left:20px;
	  width: 0em;
    margin:0px;
    border: 0px solid #BBBBBB;

}



/* -------------Lade mitarbeiter LoGa---------------------------------------- */

div#gifcheck
{
    position:absolute;
		top:3px;
		left:30px;
		font-size: 0.83em;
    width: 2em;
    padding-top:0px;
	  padding-right:10px;
    border: 0px solid #BBBBBB;

}
/* ------Anzeige der Kostenstellenverantworlichen mit Ihren Kostenstellen------*/
div#KSTV p 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
		font-size: 10px;
		font-weight:600;
		color: #D3D3D3;
		margin: 0.5em;
	  padding-top:0px;
}

div#KSTV 
{
    position:absolute;
		top:150px;
		left:300px;
		font-size: 0.83em;
    width: 31.5em;
    margin:0px;
    
	  background-color: #FFFFFF; 
    border: 1px solid #BBBBBB;

}
/* --------------------------Benutzerverwaltung-------------------------------*/

div#titelbv p 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
		font-size: 12px;
		font-weight:600;
		color: #D3D3D3;
		margin: 0.5em;
	  padding-top:0px;
}

div#titelbv 
{
    position:absolute;
		top:123px;
		left:160px;
		font-size: 0.83em;
    width: 59.5em;
    padding-top:0px;
	  padding-right:10px;
    background-color: #F5F5F5; 
    border: 1px solid #BBBBBB;

}




div#benutzerverwaltung p 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
		font-size: 10px;
		font-weight:600;
		color: #D3D3D3;
		margin: 0.5em;
	  padding-top:0px;
}

div#benutzerverwaltung 
{
    position:absolute;
		top:150px;
		left:160px;
		font-size: 0.83em;
    width: 60.2em;
    margin:0px;
   
	  background-color: #FFFFFF; 
    border: 1px solid #BBBBBB;

}


div#top 
{
    
		position:absolute;
		top:15px;
		left:270px;
		font-size: 0.83em;
    width: 50em;
    margin:0px;
    padding: 0;
    background-color: #FFFFFF; 
    border: 1px solid #BBBBBB;
}


div#Inhalt2 
{
    
		position:absolute;
		top:85px;
		left:5px;
		font-size: 0.83em;
    width: 70em;
    margin:0px; 
    padding: 0;
    height:400px; 
		background-color: #FFFFFF; 
    border: 1px solid #BBBBBB;
    z-index:2;

}



* html div#Inhalt 
{
    height: 1em;  /* Workaround gegen den 3-Pixel-Bug des Internet Explorers */
}

div#Inhalt h2 
{
    margin: 0.2em 0;
}

div#Inhalt p 
{
    font-weight: normal;
    margin: 1em 0;
}

p#Fusszeile 
{
    clear: both;
    font-size: 12px;
    font-weight: normal;
    margin: 0; 
    padding: 0.1em;
    text-align: center;
    background-color: #FFFFFF; 
    border: 1px solid #BBBBBB;
  }


/* Schriften */

a
{ 
    color: #000000; text-decoration: none; 
}

a:hover 
{ 
    color: #920404; text-decoration: none; 
}

h1 
{
    font-family: Garamond, Verdana, Tahoma, Microsoft Sans Serif, Arial;
    font-size: 24px;
    color: #000000;
}

h2 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
    font-size: 11px;
    font-weight: bold;
    line-height: 15px;
    color: #000000;
}

h3 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
    font-size: 10px;
    letter-spacing: 3px;
    line-height: 10px;
    text-transform: uppercase;
    color: #000000;
}

h4 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
    font-size: 10px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #000000;
}




/*  Für alle P in Body                                                        */
p 
{
    font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
    font-size: 12px;
   
    color: #000000;
}






.»
{
    color: #920404;
}


LI.standard {
 font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
 font-size: 1.3em;
 display: inline;
 width: 150em;
 padding-left: 0px;
 padding-right: 0px;
 border-right: 5px dotted steelblue;
}

LI.letztes {
 font-family: Verdana, Tahoma, Microsoft Sans Serif, Arial;
 font-size: 1.3em;
 width: 150em;
 display: inline;
 padding-left: 10px;
 padding-right: 6px;
}

HTML Login Bereich:
Hier sind die Tabellen auch verschoben:

Code:

<html>
<head>
<title>homepage</title>
<link rel="stylesheet" type="text/css" href="CSS/style.css">
</head>
<body>

<div id="titel">
<p>Login</p>
</div>
<div id="login">


<form action="<?php print $PHP_SELF; ?>" method="POST" target="">

<div id="gifcaution">
<img src="picture/key.gif">
</div>

<p>Benutzername</p>
<input type="Text" name="user" value="" size="" maxlength=""><br>
<p>Passwort</p>
<input type="Password" name="password" value="" size="" maxlength=""><br><br>
<input type="Submit" name="login" value="Login">
</form>
</div>

</body>
</html>

AKrebs70 · 30. August 2005

Hallo!

Ich sehe das Du einige größenangaben in em machst. Gebe die Angaben besser in Pixel an.

Axel

Dr_Google · 31. August 2005

Alles klar - ich versuche es mal.
THX4HELP

Apfelkuchen · 31. August 2005

hat das mit den pixeln funktioniert

Dr_Google · 31. August 2005

den erhoften erfolg hat es leider doch nicht gebracht.
hier der link zu meiner seite, bitte schaut es auch mal mit den firefox und den IE an. www .fun-page .de .vu

✔ Firefox & IE

Dr_Google

Mitglied

AKrebs70

Dr_Google

Mitglied

AKrebs70

Dr_Google

Mitglied

Apfelkuchen

Mitglied

Dr_Google

Mitglied

Neue Beiträge