Div-Container in Div-Container zentrieren

von **mKorniK** » 09.07.2007, 23:03

Hallo,
ich habe jetzt schon lange gegoogelt aber immer ohne erfolg.
Hier im Forum habe ich auch leider nichts gefunden, dass mir konkret weiterhilft.

Ich habe 2 Div-Container.
Der erste bildet im Prinzip den äußeren Rahmen der Webseite. Diesen bekomme ich noch zentriert.
Dann habe ich einen zweiten Div-Container, der im ersten liegt und über den via iframe der Inhalt angezeigt werden soll. Der zweite soll sich nur innerhalb der ersten Containers zentrieren.

Im ersten Container soll eine Grafik eingefügt werden, über die ich mit "maps" die Links des Menüs setze.

Bitte um Hilfe!
Danke

von **havla** » 11.07.2007, 13:12

Zentrieren kannst du über margin: 0px auto;
oder soll er horizontal und vertikal zentriert sein?

von **mKorniK** » 11.07.2007, 13:15

genau. horizontal und vertikal.. hier mal der aktuelle Quellcode von mir!

Code: Alles auswählen: <body text-align:center; bgcolor="#FFFFFF"> <script type='text/javascript'> function Go(){return} </script> <script type='text/javascript' src='exmplmenu_var.js'></script> <script type='text/javascript' src='menu_com.js'></script> <noscript> your browser does not support script </noscript> <div id="Layer1" style="margin:0px auto;text-align:left; width:950px; height:586px; z-index:1; left: 5px; top: 5px;"><img src="hintergrund.jpg" width="900" height="586" border="0" usemap="#Map"> <map name="Map"> <area shape="rect" coords="313,11,343,20" href="/news/home.php" target="iframe"> <area shape="rect" coords="397,9,444,20" href="haftung.htm" target="iframe"> <area shape="rect" coords="455,8,515,21" href="impressum.htm" target="iframe"> <area shape="rect" coords="586,11,649,19" href="/myguestbook/guestbook.php" target="iframe"> <area shape="rect" coords="703,9,746,21" href="tuning.htm" target="iframe"> <area shape="rect" coords="751,9,798,21" href="design.htm" target="iframe"> <area shape="rect" coords="653,7,699,22" href="/board" target="_blank"> <area shape="rect" coords="807,10,866,20" href="/topsite" target="iframe"> <area shape="rect" coords="353,9,388,21" href="links.htm" target="iframe"> <area shape="rect" coords="526,10,574,20" href="contact.php" target="iframe"> </map> </div> <div id="Layer2" style="position:absolute; width:848px; height:316px; z-index:2; left: 29px; top: 243px;"> <iframe name="iframe" width=100% height=100% NORESIZE scrolling=auto frameborder=0 marginheight=0 marginwidth=0 src="haftung.htm"></iframe></div>

Es muss quasi nur die zweite 'Ebene innerhalb der ersten zentriert werden. Wenn ich das genauso, wie oben mache, dann leigt die ebene plötzlich unterhalt der ersten!

von **havla** » 11.07.2007, 14:37

Probiers mal so:

Code: Alles auswählen: <div id="Layer1" style="margin:0px auto;background:red;text-align:left; width:950px; height:586px; z-index:1; left: 5px; top: 5px;"><img src="hintergrund.jpg" width="900" height="586" border="0" usemap="#Map"> <map name="Map"> <area shape="rect" coords="313,11,343,20" href="/news/home.php" target="iframe"> <area shape="rect" coords="397,9,444,20" href="haftung.htm" target="iframe"> <area shape="rect" coords="455,8,515,21" href="impressum.htm" target="iframe"> <area shape="rect" coords="586,11,649,19" href="/myguestbook/guestbook.php" target="iframe"> <area shape="rect" coords="703,9,746,21" href="tuning.htm" target="iframe"> <area shape="rect" coords="751,9,798,21" href="design.htm" target="iframe"> <area shape="rect" coords="653,7,699,22" href="/board" target="_blank"> <area shape="rect" coords="807,10,866,20" href="/topsite" target="iframe"> <area shape="rect" coords="353,9,388,21" href="links.htm" target="iframe"> <area shape="rect" coords="526,10,574,20" href="contact.php" target="iframe"> </map> <div id="Layer2" style="width:848px; height:316px; z-index:2;margin:-343px auto 0px auto;"> <iframe name="iframe" width=100% height=100% NORESIZE scrolling=auto frameborder=0 marginheight=0 marginwidth=0 src="haftung.htm"></iframe> </div> </div>

Die Hintergrundfarbe dient nur zu Anschauungszwecken.

von **mKorniK** » 11.07.2007, 17:49

perfekt! Vielen Dank!!

von **Micronetic** » 07.01.2009, 14:10

Wie hast du das denn mit dem Map geschaft? Ich habe auch ein Bild in einem Div aber Dreamweaver will nicht

Code: Alles auswählen: <!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>|- michael3d.de -|</title> <link href="css/template_css.css" rel="stylesheet" type="text/css" /> </head> <body> <center> <div id="wrapper"> <div align="left" id="fernbedienung"><img src="images/1_03.jpg" border="0"/></div> <div id="header"></div> <div id="links"></div> <div id="rechts"></div> <div id="main"></div> <div id="footer"></div> </div> </div> </center> </body> </html>

Div-Container in Div-Container zentrieren

Div-Container in Div-Container zentrieren

Ähnliche Beiträge zu "Div-Container in Div-Container zentrieren"

Wer ist online?