|
|||
div box bekomme ich nett zentriert???
hallo leute,
ich habe den weg zu diesen forum gefunden durch die seite : http://www.css4you.de/. da ich dort mehre seiten gelesen habe und dachte das ich mein problem da gelösst bekomme. aber leider hat es nicht sollen sein. aus diesen grunde habe ich mich bei euch mal angemeldet und bitte hier nun um hilfe. so mein problem ist folgendes, ich habe eine seite mit so eine art css frame erstellt. nur weiss ich nicht wie ich die div box zentrieren kann es handelt sich dabei um die div box " container " sie soll dynamisch immer in der mitte sein und wie sie jetzt ist immer 800 pixel breit. und es soll noch etwas nach unten also noch etwas höher werden so das es bis runter auf den footer geht . hier mal der code den ich bis jetzt vertig habe. Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8"><title>title</title> <style type="text/css"> /* the bit that does the work */ body { margin:0; border:0; padding:0; height:100%; max-height:100%; background:#fff; font-family:arial, verdana, sans-serif; font-size:76%; overflow: hidden; } /* for internet explorer */ * html body { padding:120px 0 50px 0; } #container { font-family:"times new roman", serif; font-size: 1.2em; position:fixed; top:100px; left:0; bottom:50px; right:0; overflow:auto; background:#fff; padding:10px; text-align:center; width: 800px; clear: both; } * html #container { height:100%; width:100%; } #header { position:absolute; top:0; left:0; width:100%; height:95px; overflow:auto; background:#53829d; border-bottom:4px solid #73a2bd; } * html #header {height:120px;} #footer { position:absolute; bottom:0; left:0; width:100%; height:30px; overflow:auto; text-align:right; background:#73a2bd; border-top:5px solid #53829d; } * html #footer {height:50px;} /* end of bit that does the work */ h1 {font-size:4em; margin:0; padding:0;} #footer p { color:#fff; margin:5px 10px 0 10px; } #header img { margin:10px 10px 0 10px; } #container img {margin:5px;} #absolute { position:absolute; top:400px; right:100px; width:200px; background:#ddd; padding:10px; border:1px solid #000; } #left { float:left; background:#eee; padding:10px; border:1px solid #000; color:#000; width:50%; } #right { float:right; background:#ddd; padding:10px; border:1px solid #000; color:#000; } a, a:visited { font-size:1.1em; text-decoration:none; color:#ddd; } a:hover { color:#fff; text-decoration:none; } .grey {color:#888;} .ltgrey {color:#ddd;} img#mascot {float:right;} #header ul { clear:both; text-align:center; border-top:1px solid #73a2bd; } #header ul { margin:0; padding:0; list-style-type:none; background:transparent; height:3em; } #header ul li { display:inline; color:#73a2bd; } .strike {text-decoration:line-through;} .lft {float:left;} .rgt{float:right;} .columnone, .columntwo {width:31%; float:left; text-align:justify; margin-right:2%;} .columnthree {text-align:justify; border:1px solid #fff;} * html .columnthree {border:0;} hr {clear:both; border:0; height:1px; color:#888; background-color:#888;} .columnthree a, .columnthree a:visited {font-size:1em; color:#000; text-decoration:underline;} .columnthree a:hover {color:#888; text-decoration:none;} </style></head> <body> <div id="container"> <h1 align="center">DIESE DIV BOX MÖCHTE ICH GERNE ZENTRIEREN !! </h1> Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! </p> </p> Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! </p> </p> </p> Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! </p> <h1 align="center">DIESE DIV BOX MÖCHTE ICH GERNE ZENTRIEREN !! </h1> </p> </p> Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! Hallo hier der Inhalt !!! </p> </div> <div id="header"> <div align="center"> Hier der Link - Hier der Link - Hier der Link - Hier der Link - Hier der Link </div> </div> <div id="footer"> <p class="lft">Impressum - Kontakte</p> Copyright © </p> </div> </body></html> |
Sponsored Links |
|
|||
In der Suche findet sich dazu einiges: http://www.xhtmlforum.de/search.php?mode=results
Ich zitier mal fricca, die (der?) hat das mal kurz und knapp formuliert: Zitat:
|
Sponsored Links |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Schriftfarbe in den Eintragungsfeldern von jforms | Steveislucky | CSS | 2 | 16.03.2010 10:59 |
CSS Text nebeinander? | carstiee09 | CSS | 13 | 13.11.2009 19:18 |
Grundsatzfrage über padding, Box sprengt vorhandene div box | michi-muc | CSS | 5 | 22.10.2009 14:39 |
div id zentriert sich nicht | earworms | CSS | 8 | 21.06.2006 17:01 |
#boxes a:hover.info: 2.posting mit css !!! | marioN | CSS | 5 | 25.01.2004 17:04 |