• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

unverständliche Darstellungsweisen im IE

Status
Für weitere Antworten geschlossen.

MrDeluxe

Neues Mitglied
so sieht der Kopf aus:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>mein Titel</title>
<!--[if IE6]><link rel="stylesheet" media="all" href="IE.css"><![endif]-->
<link rel="stylesheet" media="all" href="Firefox2.css"/>
<style type="text/css">
Firefox2.css
Code:
@charset "utf-8";
/* CSS Document */
body {
    background-color: #000000;
}

*{
padding:0;
margin:0;
}
html, body{
height:100%;
background-color:#000000;
}
div#wrap{
    width:425px;
    height:325px;
    background-position:center;
    background-repeat:no-repeat;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    position: absolute;
    padding-left: -10px;
    left: 171px;
    top: 310px;
}
iframe#Fenster{
    width:425px;
    height:325px;
    margin-top: -150px;
    margin-right: 380px;
    margin-bottom: 0px;
    margin-left: 0px;
    position: static;
}
#apDiv1 {
    position:absolute;
    left:47px;
    top:33px;
    width:334px;
    height:117px;
    z-index:1;
}
#apDiv2 {
    position:absolute;
    left:43px;
    top:527px;
    width:110px;
    height:90px;
    z-index:2;
}
so das selbe hab ich voerst für den IE genommen... ich hab mal versucht ein wenig dran rumzuprobieren, hab aber bemerkt das sich im IE gar nichts geändert hat...
gibt es da schon einen Fehler, den ich vllt. gemacht habe?

und nun wird es total unverständlich für mich:



das Problem ist natürlich der Frame in der Mitte, der nur zu hälfte angezeigt wird. gemacht hab ich das mit IE6
im Firefox dagegen gibt es 0 Probleme...

HilfE! PLZ!
 
Zuletzt bearbeitet:
Hab nur kurz drüber geschaut, aber ich tippe auf die absolute Positionierung. Wenn möglich, sollte man darauf verzichten, da Elemente so aus ihrem natürlichen Fluss im Dokument genommen werden.
 
Welche Positionierung empfiehlt denn der Erfahrene Benutzer und warum? ;)

fest?
relativ?
oder
statisch?

absolut - wozu braucht man die dann?
Wäre gut eine Begründung dazu zugeben! Danke!
 
Gerade für CSS-Einsteiger erscheint die absolute Positionierung als Offenbarung. So »leicht« es am Anfang auch erscheinen mag, die absolute Positionierung ist kein Allheilmittel. Spätestens, wenn Elemente aufeinander Bezug nehmen sollen, scheitert man damit.
Absolute Positionierung sollte daher mit Bedacht nur dann eingesetzt werden, wenn ein Element wirklich unabhängig von seiner Umgebung sein soll – was selten der Fall ist.
Ich persönlich versuche weitestgehend auf position zu verzichten.
MrDeluxe schrieb:
Wäre gut eine Begründung dazu zugeben!
Die hatte ich allerdings schon oben gegeben:
gruenspan schrieb:
da Elemente so aus ihrem natürlichen Fluss im Dokument genommen werden.
 
Das alte Problem ist gelöst Aber ein neues tritt auf:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>www.electrikk.de</title>
<!--[if IE6]><link rel="stylesheet" media="all" href="IE.css"><![endif]-->
<link rel="stylesheet" media="all" href="Firefox2.css"/>
<style type="text/css">
</style>
das ist geblieben... ^^

IE.css :
Code:
@charset "utf-8";
/* CSS Document */
body {
    background-color: #000000;
}

*{
padding:0;
margin:0;
}
html, body{
height:100%;
background-color:#000000;
}
div#wrap{
    width:425px;
    height:325px;
    background-position:center;
    background-repeat:no-repeat;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: 100px;
    padding-left: -10px;
    left: 171px;
    top: 310px;
    position: absolute;
}
iframe#Fenster{
    width:425px;
    height:325px;
    margin-top: -150px;
    margin-right: 380px;
    margin-bottom: 10px;
    margin-left: 100px;
    position: absolute;

}
#apDiv1 {
    position:static;
    left:47px;
    top:33px;
    width:334px;
    height:117px;
    z-index:1;
    position: absolute;

}
#apDiv2 {
    position:static;
    left:43px;
    top:527px;
    width:110px;
    height:90px;
    z-index:2;


}
so siehts im IE aus:



wenn ich aber was im IE.css verändere und im IE7 teste ändert sich nichts... warum?????
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben