ComputerBase Menü
Aktuelles

[HTML] Div Layer lässte anderen Layer verschwinden

M.o.D

M.o.D

Lt. Commander
Registriert
Nov. 2002
Beiträge
1.234
Hi,

Ich hab hier grad ne Site, bei der ich viel mit Div Layern arbeite und auch iframes benutze..

Ich hatte diesen code hier

HTML: 
<html>
<head><title>Mortada Printing</title>
<style type="text/css">
#topbg {position: absolute; left: 0px; top: 0px; width: 100%; height: 153px;}
#leftbg {position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;}
#logo1 {position: absolute; left: 10px; top: 13px; width: 219px; height: 129px;}
#logo2 {position: absolute; left: 280px; top: 35px; width: 537px; height: 76px;}
</style>
</head>
<body marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
<div id="topbg">
<img src="pix/img/bg.gif" width="100%" height="100%">
</div>
<div id="logo1">
<img src="pix/img/logo1.gif" width="100%" height="100%">
</div>
<div id="logo2">
<img src="pix/img/logo2.gif" width="100%" height="100%">
</div>
<div id="leftbg">
<img src="pix/img/leftbg.gif" height="100%" width="100%">
</div>
</body>
</html>

Da is noch alles in Ordnung.. als ich aber nen weiteren Div Layer hintugefügt habe, wurde der Layer "leftbg" nicht mehr angezeigt.

Das ist der aktuelle code, bei dem der "leftbg" layer nicht angezeigt wird
HTML: 
<html>
<head><title>Mortada Printing</title>
<style type="text/css">
#topbg {position: absolute; left: 0px; top: 0px; width: 100%; height: 153px;}
#leftbg {position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;}
#logo1 {position: absolute; left: 10px; top: 13px; width: 219px; height: 129px;}
#logo2 {position: absolute; left: 280px; top: 35px; width: 537px; height: 76px;}
#butt1 {position: absolute; left: 260px; top: 116px; width: 570px; height: 33px;}
</style>
</head>
<body marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
<div id="topbg">
<img src="pix/img/bg.gif" width="100%" height="100%">
</div>
<div id="logo1">
<img src="pix/img/logo1.gif" width="100%" height="100%">
</div>
<div id="logo2">
<img src="pix/img/logo2.gif" width="100%" height="100%">
</div>
<div id="butt1">
<iframe src="frames/butt1.htm" name="button1" width="570" height="33" marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" scrolling="no" frameborder="0">
</div>
<div id="leftbg">
<img src="pix/img/leftbg.gif" height="100%" width="100%">
</div>
</body>
</html>

Ich komm da nicht weiter.. hab mir den Code tausenmal durchgelesen und auch zigmal neugeschrieben und imm noch das gleiche Problem..

Wo isn da der Fehler?

MfG
M.o.D
 
Zuletzt bearbeitet von einem Moderator:
Warum stapelst du die Container aufeinander?
top:0px;left:0px;width:100%; bei #topbg und bei #leftbg sind dieselben Koordinaten...
 
Hallo!

Du hast den <iframe>-Tag nicht geschlossen.
Entweder du schließt ihn im neuen X(HT)ML-Stil, also a'la <iframe eigenschaft="wert" /> oder wie üblich <iframe></iframe>.

@Püppchen (Sorry :D):

Das könnte er mit der CSS-Eigenschaft z-index, welche die sich überlappenden Elemente von gering (hinten) nach hoch (vorne) sortieren kann, machen. Ist aber nicht nötig, da, wie eben bereits erwähnt, der Iframe-Tag nicht richtig geschlossen ist.
 
Zuletzt bearbeitet:
wegen dem übereinanderstapeln, hab mich beim tausendstenmal neuschreiben wohl etwas ausgelassen.

der leftbg layer is in nem anderen layer, welcher unter dem topbg layer is..

hab den jetzt geändert und auch den iframe tag geschlossen.. machter trotzdem nich

HTML: 
<html>
<head><title>Mortada Printing</title>
<style type="text/css">
#topbg {position: absolute; left: 0px; top: 0px; width: 100%; height: 153px;}
#left {position: absolute; left: 0px; top: 153px; width: 19.25%; height: 100%;}
#leftbg {position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;}
#logo1 {position: absolute; left: 10px; top: 13px; width: 219px; height: 129px;}
#logo2 {position: absolute; left: 280px; top: 35px; width: 537px; height: 76px;}
#butt1 {position: absolute; left: 260px; top: 116px; width: 570px; height: 33px;}
</style>
</head>
<body marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
<div id="topbg">
<img src="pix/img/bg.gif" width="100%" height="100%">
</div>
<div id="logo1">
<img src="pix/img/logo1.gif" width="100%" height="100%">
</div>
<div id="logo2">
<img src="pix/img/logo2.gif" width="100%" height="100%">
</div>
<div id="butt1">
<iframe src="frames/butt1.htm" name="button1" width="570" height="33" marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" scrolling="no" frameborder="0" />
</div>
<div id="left">
<div id="leftbg">
<img src="pix/img/leftbg.gif" height="100%" width="100%">
</div>
</div>
</body>
</html>
 
1. Problem:
PHP: 
#leftbg {position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;}
Durch das "position:absolute;" werden top und left am html-Dokument gemessen und nicht am Elternelement (<div id="left">).

2.Problem:
Ich weiss auch nich woran das liegt, aber der div-layer, der den iframe enthält , sollte im Quelltext als letztes stehen, also:
PHP: 
<body marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
  <div id="topbg">
    <img src="pix/img/bg.gif" width="100%" height="100%">
  </div>

  <div id="logo1">
    <img src="pix/img/logo1.gif" width="100%" height="100%">
  </div>
  
  <div id="logo2">
    <img src="pix/img/logo2.gif" width="100%" height="100%">
  </div>
  
  <div id="leftbg">
    <img src="pix/img/leftbg.gif" height="100%" width="100%">
  </div>

  <div id="butt1">
    <iframe src="frames/butt1.htm" name="button1" width="570" height="33" marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" scrolling="no" frameborder="0">
  </div>
</body>
 
Korrekt.. hab den iframe layer als letztes getan und es klappt..
THX

/edit
mhh.. aber wie mach ich dass wenn ich mehrere iframes in verschiedenen div layern hab?

habs grad so versucht:
HTML: 
<html>
<head><title>Mortada Printing</title>
<style type="text/css">
#topbg {position: absolute; left: 0px; top: 0px; width: 100%; height: 153px;}
#left {position: absolute; left: 0px; top: 153px; width: 19.25%; height: 75%;}
#leftbg {position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;}
#logo1 {position: absolute; left: 10px; top: 13px; width: 219px; height: 129px;}
#logo2 {position: absolute; left: 280px; top: 35px; width: 537px; height: 76px;}
#butt1 {position: absolute; left: 260px; top: 116px; width: 570px; height: 33px;}
#butt2 {position: absolute; right: 3px; top: 50px; width: 115px; height: 100%;}
</style>
</head>
<body marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
<div id="topbg">
<img src="pix/img/bg.gif" width="100%" height="100%">
</div>
<div id="logo1">
<img src="pix/img/logo1.gif" width="100%" height="100%">
</div>
<div id="logo2">
<img src="pix/img/logo2.gif" width="100%" height="100%">
</div>
<div id="left">
<div id="leftbg">
<img src="pix/img/leftbg.gif" height="100%" width="100%">
</div>
<div id="butt2">
<iframe src="frames/butt2.htm" name="button2" width="115" height="500" marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" scrolling="no" 

frameborder="0" />
</div>
</div>
<div id="butt1">
<iframe src="frames/butt1.htm" name="button1" width="570" height="33" marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" scrolling="no" 

frameborder="0" />
</div>
</body>
</html>

da zeigt der aber nur den butt1 layer am falschen platz an. und zwar unter dem left layer.

wie soll ich das dann schreiben?
 
Zuletzt bearbeitet:
Faustpfand schrieb:
Entweder du schließt ihn im neuen X(HT)ML-Stil, also a'la <iframe eigenschaft="wert" /> oder wie üblich <iframe></iframe>.
Zum Vergrößern anklicken....

Ehrlich gesag glaube ich nicht, dass zweiteres funktioniert. Diese Schreibweise ist afaik nur für XHTML-Tags bestimmt, die kein extra schließendes Tag besitzen, wie z.B. <img .... />

Probier daher mal mit <iframe ...></iframe>.
 
Danke jetzt funktionierts..
 
PuppetMaster schrieb:
Ehrlich gesag glaube ich nicht, dass zweiteres funktioniert. Diese Schreibweise ist afaik nur für XHTML-Tags bestimmt, die kein extra schließendes Tag besitzen, wie z.B. <img .... />

Probier daher mal mit <iframe ...></iframe>.
Zum Vergrößern anklicken....

Sorry, dass ich dir schon wieder widersprechen muss :-)
Diese Schreibweise ist lt. XHTML1- und 1.1-Standard für alle Tags vorgesehen, die keinen Inhaltswert besitzen. Man kann auch Image-Tags in Form <img></img> schließen, genau wie <meta></meta> oder <br></br>. Da aber in der XML-Sprache ebenfalls die abgekürzte Form für „leere“ Tags zum Einsatz kommt (<tag />), ist dies bei jedem inhaltslosen HTML-Tag ebenfalls möglich. Sofern man sich denn an den XHTML-Standard hält.
Bei HTML4 sollte das allerdings von den meisten Browsern trotzdem richtig interpretiert werden.

Kurzum: <iframe></iframe> ist letztendlich dasselbe wie <iframe />.
Es muss halt ab XHTML 1.0 jeder Tag geschlossen werden.
 
Hab doch mal nachgeschaut, und du hast anscheinend recht! Aber warum funktionierts dann jetzt? :confused_alt:

Naja egal, ohne Doctype ists eh kein XHTML sondern irgendwas, und in XHTML selbst gibts Frames bestenfalls noch in der Transitional-Variante. :D
 
Naja, genauer gesagt in der 1.0-Frameset-Variante. Aber in 1.1 wurden Frames glaube ich wirklich abgeschafft, und wenn du mich fragst: Richtig so. :freaky:
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Ähnliche Themen

Digger-Deluxe
Div-Layer überlagert dahinterliegende Links
Antworten
3
Aufrufe
2.331
Stefan-
S
D
Frage zu DIV Layer.. IE und Firefox
Antworten
11
Aufrufe
2.011
Fleshgrinder
Fleshgrinder
R
div Layer bei ebay?
Antworten
2
Aufrufe
1.186
Mr. Snoot
M
R
DIV lässt sich nicht im Firefox UND Internet Explorer korrekt positionieren
Antworten
1
Aufrufe
927
Rayne
R
markus1234
(HTML) Layer-Popup außerhalb von Ursprungstabelle erzwingen
Antworten
1
Aufrufe
988
markus1234
markus1234
Zurück
Oben

Willkommen auf ComputerBase!

Mit Werbung weiterlesen

Besuche ComputerBase wie gewohnt mit Werbung und Tracking. Die Zustimmung ist jederzeit widerrufbar.

Details im Privacy Center und in der Liste unserer Partner. Ein Widerruf ist möglich in der Datenschutzerklärung.

… oder ComputerBase Pro bestellen

Nutze ComputerBase ohne Werbebanner, Video-Ads und Werbetracking schon für 4 €/Monat oder 36 €/Jahr.

Mehr zu ComputerBase Pro

Bereits Pro-Nutzer? Hier anmelden.

Tracking: Wir und unsere 175 Partner verarbeiten personenbezogene Daten, indem wir mit auf Ihrem Gerät gespeicherten Informationen (z. B. eindeutige Kennungen in Cookies) ein Nutzungsprofil erstellen, um z. B. Anzeigen zu personalisieren. Verarbeitungszwecke: Genaue Standortdaten und Abfrage von Geräteeigenschaften zur Identifikation, Informationen auf einem Gerät speichern und/oder abrufen, Personalisierte Anzeigen und Inhalte, Anzeigen- und Inhaltsmessungen, Erkenntnisse über Zielgruppen und Produktentwicklungen.

Impressum Kontakt Datenschutz