<div> soll restliche seite überdecken - klappt nicht im IE

[VerteX]

hi

habe - wie so oft - ein problem mit dem internet explorer.

ich habe unter dem eigentlichen inhalt meiner seite einen div-block positioniert, welcher noch auf "visibility: hidden" gestellt ist.
dieser soll bei bedarf per javascript eingeblendet werden und dann vor der ganzen seite angezeigt werden, sodass die seite dahinter nur noch ein klein bischen durchscheint, was ich mit

position: fixed; top: 0; left: 0; width: 100%; height: 100%;

in allen anderen standard-konformen browsern hinbekommen habe.
nur der IE verweigert diese einstellung wieder und zeigt den div block unter dem eigentlichen inhalt an, anstatt diesen zu überdecken.
auch "position: absolute;" wirkt nicht...

dies ist das sorgenkind, einfach mal im IE öffnen und auf "einblenden" klicken, damit ihr seht, was ich meine:
www.s159880906.online.de/mob1

in anderen foren konnte mir noch nicht geholfen werden :(

[Inita_rr]

hi,

ich denke wegen deinem CSS height : 100%

<div style="position: absolute; top: 0pt; left: 0pt; width: 100%; height: 100%; background-color: white; visibility: hidden; text-align: center; z-index: 50;">  </div>

LG,
Inita

P.S. und schreibe nicht inline css, sondern externe !!

[VerteX]

@EKKI:
ich achte sehr auf einrückung und der code ist eigentlich auch eingerückt, jedenfalls wenn ich ihn in phpEdit ansehe und über firefox -> quellcode anzeigen...

z-index ist überall, wo es wichtig ist, eingestellt.
je weiter oben das element liegen soll, desto größer ist auch der z-index wert, den ich gewählt habe.
aber ansonsten werde ich jetzt nicht weiter schlau aus deinem link, welche problematik? es wundert mich aber, dass es im firefox funktioniert.

@Inita_rr:
das inline-css ist bisher nur, weil das nur ein entwurf ist. sobald alles funktioniert exportiere ich die CSS schnipsel und fasse sie in klassen zusammen ;)

was soll ich denn statt der height: 100% angeben, damit der div-block den ganzen bildschirm füllt?

[ChrisB]

Hi,

@EKKI:
ich achte sehr auf einrückung und der code ist eigentlich auch eingerückt, jedenfalls wenn ich ihn in phpEdit ansehe und über firefox -> quellcode anzeigen...

Schoen, dass du darauf eingehst - auf den Hinweis auf die Fehler aber nicht.
Also beseitige diese *jetzt* bitte, danach koennen wir weiter sehen.

@Inita_rr:
das inline-css ist bisher nur, weil das nur ein entwurf ist. sobald alles funktioniert exportiere ich die CSS schnipsel und fasse sie in klassen zusammen ;)

Machst du dir also gerne zusaetzliche Arbeit?

Fuer die jenigen hier, die dein Problem nachvollziehen wollen/sollen, erhoehst du damit jedenfalls den Aufwand - weil das ganze eben reichlich unuebersichtlich ist.
Inline-Styles taugen m.E. zum Testen hoechstens mal fuer eine Kleinigkeit, die man mal veraendern will.
Wenn du aber die komplette Formatierung derart umsetzt, wird das ganze schnell unueberschaubar.
Ausserdem handelst du dir mit "spaeter pack ich das in Klassen" evtl. dann sogar wieder weitere Probleme ein, wenn es um die Spezifitaet der Selektoren geht.

Tue dir und uns also bitte den Gefallen, da gleich von Anfang an Ordnung reinzubringen.

MfG ChrisB

[VerteX]

Hi,

@EKKI:
ich achte sehr auf einrückung und der code ist eigentlich auch eingerückt, jedenfalls wenn ich ihn in phpEdit ansehe und über firefox -> quellcode anzeigen...

Schoen, dass du darauf eingehst - auf den Hinweis auf die Fehler aber nicht.
Also beseitige diese *jetzt* bitte, danach koennen wir weiter sehen.

die fehler sind alle völlig banal. sie werden gemeldet, weil ich keinen document-type angegeben habe. (z.b. "there is no attribute 'name'")
das werde ich machen, sobald ich den richtigen typ ermittelt habe.

aber beim zerlegen der inline-styles in klassen fiel mir ein fehlender doppelpunkt hinter "top" auf...
und jetzt funktioniert es auch im IE. da hat der firefox mal eben seine version - richtig - hineininterpretiert.

aber trotzdem danke, immerhin hat mich die hilfe hier darauf gebracht :D

[ChrisB]

Hi,

die fehler sind alle völlig banal.

Nein, sind sie nicht.
Table in Span zu verscachteln, ist zum Beispiel nicht erlaubt.

sie werden gemeldet, weil ich keinen document-type angegeben habe. (z.b. "there is no attribute 'name'")
das werde ich machen, sobald ich den richtigen typ ermittelt habe.

Zum ersten solltest du dir das eigentlich vorher ueberlegt haben, nach den Regeln welches Doctype du dein Dokument erstellst; und zum zweiten wirst du wohl keinen finden, der fuer Span oder Div ein name-Attribut erlaubt.

aber beim zerlegen der inline-styles in klassen fiel mir ein fehlender doppelpunkt hinter "top" auf...

Wie gesagt, die Uebersichtlichkeit ...

MfG ChrisB

[VerteX]

Hi,

die fehler sind alle völlig banal.

Nein, sind sie nicht.
Table in Span zu verscachteln, ist zum Beispiel nicht erlaubt.

sie werden gemeldet, weil ich keinen document-type angegeben habe. (z.b. "there is no attribute 'name'")
das werde ich machen, sobald ich den richtigen typ ermittelt habe.

Zum ersten solltest du dir das eigentlich vorher ueberlegt haben, nach den Regeln welches Doctype du dein Dokument erstellst; und zum zweiten wirst du wohl keinen finden, der fuer Span oder Div ein name-Attribut erlaubt.

aber beim zerlegen der inline-styles in klassen fiel mir ein fehlender doppelpunkt hinter "top" auf...

Wie gesagt, die Uebersichtlichkeit ...

MfG ChrisB

ich hatte vorher nie bedacht, dass man auch nach namen zuweisen kann (also mit div#name) und hab immer nur an klassen gedacht. da dachte ich mir dann, ich mache überall erstmal inline, packe das danach in klassen und allen elementen die die gleichen einstellungen haben, wird dann die jeweilige klasse zugewiesen.

ich hab das mit den document-types früher nie ernst genommen und für wichtig empfunden, deshalb vernachlässige ich das leider etwas.

mir wurde immer gesagt, ich solle der kompatibilität zu alten browsern zu liebe auch zusätzlich zum id-attribut auch noch das name-attribut angeben ;)

das mit kein table in span war mir neu, aber ok, jetzt weiß ichs

[ChrisB]

Hi,

ich hatte vorher nie bedacht, dass man auch nach namen zuweisen kann (also mit div#name)

Kann man auch nicht.

mir wurde immer gesagt, ich solle der kompatibilität zu alten browsern zu liebe auch zusätzlich zum id-attribut auch noch das name-attribut angeben ;)

Ist bloedsinnig.

MfG ChrisB

[EKKi]

Mahlzeit VerteX,

z-index ist überall, wo es wichtig ist, eingestellt.
je weiter oben das element liegen soll, desto größer ist auch der z-index wert, den ich gewählt habe.

Richtig - aber immer nur in Abhängigkeit vom "Elternelement" (bzw. dessen z-Index) des Elements, dem Du einen expliziten z-Index verpasst.

aber ansonsten werde ich jetzt nicht weiter schlau aus deinem link, welche problematik? es wundert mich aber, dass es im firefox funktioniert.

Falls Du SELFHTML noch nicht so kennst:

1.) Wenn Du auf "<http://de.selfhtml.org/css/eigenschaften/anzeige/z_index.htm@title=Anzeigebeispiel: So sieht's aus>" klickst, bekommst Du ein Beispiel, wo Du meistens recht schnell nachvollziehen kannst, was im dazu gehörenden Text beschrieben wird.

2.) Wenn Du "Beachten Sie:" beachtest, erfährst Du auch Details zu den Besonderheiten einzelner Browser.

MfG,
EKKi

[EKKi]

Mahlzeit VerteX,

in allen anderen standard-konformen browsern hinbekommen habe.
nur der IE verweigert diese einstellung wieder und zeigt den div block unter dem eigentlichen inhalt an, anstatt diesen zu überdecken.
auch "position: absolute;" wirkt nicht...

Die http://de.selfhtml.org/css/eigenschaften/positionierung.htm#z_index@title=z-index-Problematik ist Dir bekannt?

dies ist das sorgenkind, einfach mal im IE öffnen und auf "einblenden" klicken, damit ihr seht, was ich meine:
www.s159880906.online.de/mob1

Invalide <div>-Suppe ("5 Errors, 18 warning(s)"), würde ich sagen. Rück Deinen Code mal ein, damit man die Verschachtelung besser erkennen kann ... ich hab jetzt wenig Lust, Deinen Code auseinanderzupflücken, um zu sehen, wessen Kind Deine "Lightbox" ist.

MfG,
EKKi