Frage HTML - Problem mit IE9

[Sig1]

Hallo liebe Community,

ich habe bei meiner Homepage folgendes Problem:
Ich habe einen headér, der ganz oben fixiert ist. Außerdem habe ich ein absolut positioniertes Bild und darunter einen Text. Natürlich sollen Bild und Text absolut unter dem header positioniert sein. Das klappt auch auf fast allen Rechnern, nur auf ein paar, die IE9 benutzen, nicht. Dort wird das Bild automatisch ganz oben positioniert, also hinter dem header, sodass der ganze Text auf einer Seite ist und man nicht mehr scrollen kann.
Weiß einer, wie man dieses Problem lösen kann?

Das CSS-Sheet sieht folgendermaßen aus:

header{
border-bottom:solid grey;
width:100%;
height:35%;
position:fixed;
padding:0;
margin:0;
text-align:center;
background-color:white;
}
#content #bild (div-Container, der das Bild enthält){
position:absolute;
width:56%;
left:22%;
top:41%;
border:thin solid grey;
padding:0;
height:25%;
overflow:hidden;
}
#content img{
margin:0;
padding:0;
min-width:100%;
min-height:100%;
}
#content #p1{
position:absolute;
width:56%;
left:22%;
top:70%;
color:black;
font-size:100%;
font-family: 'Open Sans', sans-serif;
padding-bottom:5%;
}

 

[MrMurphy]

Hallo,

deine Quelltextschnipsel helfen nicht mal ansatzweise weiter. Bitte einen Link zu der Seite oder, als zweitbeste Lösung, den GESAMTEN Quelltext mit Bild und CSS.

Natürlich sollen Bild und Text absolut unter dem header positioniert sein

Nein, ganz im Gegenteil.

Deine absolute- und fixed-Angaben werden das Problem sein, aber ohne Quelltext...

Gruss

MrMurphy

 

[Sig1]

Die Seite heißt

http://moveyourmind.de/index.html

und das Problem tritt bei den Unterseiten auf wo ein Bild und ein Text vorhanden sind.

 

[Sig1]

Hallo,

deine Quelltextschnipsel helfen nicht mal ansatzweise weiter. Bitte einen Link zu der Seite oder, als zweitbeste Lösung, den GESAMTEN Quelltext mit Bild und CSS.

MrMurphy

Hilft der Link weiter?

 

[MrMurphy]

Hallo

Hilft der Link weiter?

Ja. Aber ich weiß nicht wie ich dir weiterhelfen kann. Ich hatte gehofft das jemand antwortet der Zugriff auf den originalen IE9 hat.

Ich habe keinen Rechner mit dem originalen IE9 und kann deshalb nur mit dem IE11 den IE9 simulieren. Damit wird die Seite wie von dir erwartet angezeigt. Das muss aber nichts heißen, da die Simulation im IE11 sich teilweise anders verhält als der originale IE9. Die Simulation ist nur ein Hilfsmittel.

Im Quelltext selbst ist mir aufgefallen das fast alle Elemente mit "position: fixed" oder "position: absolute" aus dem Textfluss genommen sind. Das widerspricht dem eigentlichen Vorgehen zum Erstellen von HTML-Webseiten und schafft Probleme.

So hat zum Beispiel der div-Container "#content" praktisch keinen Inhalt und damit keine Höhe mehr.

Das Problem hatte sich bereits durch deine Bemerkung

Natürlich sollen Bild und Text absolut unter...

angedeutet und nun bestätigt.

Damit eine Webseite in möglichst vielen Browsern sinnvoll angezeigt wird muss zunächst das Grundgerüst und die CSS-Grundeinstellung stimmen. Daran hapert es leider in deiner Webseite.

Mit ein paar einfachen Korrekturen ist es nicht getan. Das HTML und das CSS sollten zunächst komplett neu schulmäßig erstellt werden. Hört sich langweilig an, ist aber die Grundlage für stabile Layouts. Dazu fehlen die aber wahrscheinlich die Grundlagen, sonst hättest du das bereits getan.

Deshalb kann ich dir leider nicht wirklich weiterhelfen, sondern dir nur einen sinnvollen Anfang aufweisen.

Gruss

MrMurphy