|
|||
DIV Container ist horizontal zentriert! aber der inhalt leider nicht !
Hi alle Zusammen
ich sehe vor lauter Wald die Bäume nicht mehr! ich arbeite gerade an einer Typo3 Seite und erstelle eine neues Design. Leider schaffe ich es nicht, mit Div den Inhalt innerhalb des Containers zu zentrieren. der äußere ist zentriert. Bin jetzt schon fast zwei tage daran und brauche eure Hilfe... hier meine template.htm <!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> <title>Template</title> </head> <!-- ###DOKUMENT### begin--> <div id="container1">###container1### <div id="top-banner" style="background-image: url(../hundewelt/fileadmin/cms/top-banner.jpg);"></div> <div id="top-menu" style="background-image: url(../hundewelt/fileadmin/cms/top-menu.jpg); ">###TOP-menu### <div style="clear:both;"></div> </div> <div id="inhalt-links" style="z-index: 3;">###inhalt-links###<div style="clear:both;"></div></div> <div id="inhalt-mitte" style="z-index: 3;">###inhalt-mitte###</div> <div id="inhalt-rechts" style="z-index: 3;">###inhalt-rechts###</div> <div id="rand-impress" style="z-index: 6; background-image: url(../hundewelt/fileadmin/cms/rand-impress.jpg);">###impress###</div--> </div> <!-- ###DOKUMENT### end --> </body> </html> hier meine style.css @charset "utf-8"; body { background: #D5CCAF ; padding: 0; margin: 0; text-align: center; } /*CONTAINER*/ #container1 { background-color: #fff ; background-image:url(http://172.16.0.14/hundewelt/fileadmin/cms/rahmen.jpg); text-align: left; padding: 0px; border: 0px dashed #b9821a; margin: 30px auto 0; width: 990px; height: 638px; } #top-banner { text-align: left; padding: 0px; border: 0px dashed #b9821a; margin: 30px auto 0; position: absolute; top: 15px; left: 15px; width: 510px; height: 125px; background: no-repeat; } #top-menu { text-align: left; padding: 0px; border: 0px dashed #b9821a; margin: 30px auto 0; position: absolute; top: 15px; left: 525px; width: 248px; height: 145px; background: no-repeat;} #rand-impress { text-align: left; padding: 0px; border: 0px dashed #b9821a; margin: 30px auto 0; position: absolute; top: 15px; left: 773px; width: 201px; height: 607px; background: no-repeat;} #inhalt-links { text-align: left; border: 0px dashed #b9821a; position: absolute; top: 160px; left: 120px; width: 190px; height: 415px; border: 1px dotted #000000; background: no-repeat;} #inhalt-mitte { text-align: left; padding: 0px; border: 0px dashed #b9821a; position: absolute; top: 160px; left: 330px; width: 190px; height: 415px; border: 1px dotted #000000; background: no-repeat;} #inhalt-rechts { text-align: left; padding: 0px; border: 0px dashed #b9821a; position: absolute; top: 160px; left: 550px; width: 190px; height: 415px; border: 1px dotted #000000; background: no-repeat;} #rand-impress { text-align: left; padding: 0px; border: 0px dashed #b9821a; position: absolute; top: 15px; left: 770px; width: 201px; height: 607px; background: no-repeat;} } Geändert von svezi (07.11.2010 um 19:20 Uhr) |
Sponsored Links |
|
|||
(BODY) gleich ausgebessert...
Alle Container sollten Horizontal durch Container 1 zentriert werden leider ist es nur der Container1, die restlichen brechen leider aus dem Container1 aus und schwimmen links zentriert. Habe soeben bemerkt, wenn ich im CSS unter #container1 { overflow: hidden; angebe, das dann der IE "richtig" anzeigt nur Firefox und Opera eben nicht. Geändert von svezi (07.11.2010 um 19:20 Uhr) |
|
|||
Da Du alles was in dem #container1 ist unnötigerweise absolut positionierst, erhält #container1 keine Form und die Inhalte sind folglich auch nicht zentriert.
Du hast 2 Möglichkeiten: a) gib #container1 noch eine relative Positionierung wodurch die absolut positionierten sich an #container1 ausrichten würden. b) Verzichte auf die absolute Positionierung, verwende float um Objekte anzuordnen. Ich würde dringend b) empfehlen da dir scheinbar noch nicht bewusst ist wie absolute Positionierung funktioniert. |
|
|||
LOL
da könntest du recht haben. leider habe ich ein Grafik als Hintergrund mit Rahmen im Container1, was bedeuten würde, das durch den float Befehl der Rand dieser Grafik überdeckt werden würde. gehe ich richtig in der Annahme, das ich einen zweiten DIV Container drüber legen muss, der die Abstände des Rahmen einhält? |
|
|||
o.k. muss keinen 2 div Container anlegen!
kann ja float:left und dann mit margin-top oder -left anpassen. Schee, und wie Positioniert man dann die mittlere grafik float:middle gibt es nicht ! |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
DIV container verschachteln und pixelgenau platzieren | Yakilo | CSS | 4 | 02.02.2010 20:18 |
Div Container beinhaltet weitere Divs,wie den Container scrollen lassen? | SpecialK | CSS | 9 | 01.09.2008 12:17 |
verständnis html oder css DIV CONTAINER | creative100 | CSS | 1 | 20.08.2008 01:31 |
Problem mit position:relative; | McCoRmIcK | CSS | 0 | 08.04.2007 17:23 |
Internet Explorer stellt Layout falsch dar | phpfuchs | CSS | 2 | 14.09.2006 10:16 |