moin,
erstmal guten tag hier alle zusammen. bin neu hier und hoffe deshalb, die beschreibung entspricht den forderungen und ihr könnt mir hilfen
ich habe derzeit folgendes problem: ich habe bei meiner homepage drei verschachtelte divs, ein mutter und zwei tochter divs. das mutter-div, page, steht über menue und content. menue ist hierbei eine simple sidebar, content das text- und inhaltsfeld und page eben der gesamte oberblock.
mithilfe der faux columns methode habe ich das menue-div bis zum seitenende mitwachsen lassen, bekomme nun jedoch einen fatalen fehler (zunächst firefox). sobald des ende des menue-divs erreicht ist, springt der inhalt des content-divs nach links, sprich steht nun unter dem menue-div und nicht rechts, wo er eigentlich sollte. außerdem bekomme ich bei tabellen das problem, das diese das content-feld auf der rechten seite sprengen. dies geschieht nur bei den tabellen; ich suche hier auch einen einfacheren weg als jede tabelle zu verkleinern, da es ja einen allgemeinen befehl geben müsste.
im ie sind die symptome ähnlich, hier fängt jedoch der komplette inhalt erst nach dem ende des menue-divs an, sprich alles auf der höhe der sidebar ist im content-feld frei, danach läuft alles ungeniert und "schön" links (sollte natürlich rechts stehen) - auch hier wieder das gleiche mit tabellen.
hier noch ein kleiner auszug aus der extern ausgelagerten css-datei:
(hinweis: ich habe content dem page-div untergeordnet, weil ich das durch googlen bei einem ähnlichen beispiel gefunden hatte und dadurch für mich ein weiteres problem eliminiert wurde. wenn ich menue nun auch noch page unterordne, wird die sidebar allerdings bis zum content-feld hin nach rechts breiter und der inhalt beginnt erst weiter unten. sehr konfus das ganze.
body {
margin-left: 5px;
margin-top: 5px;
background-color: #ffffff;
height: auto;
width: 878px;
}
body,td,th {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
}
/* hier steht fuer dieses beispiel irrelevanter kram */
div#page {
height: auto;
top: 0px;
bottom: 0px;
width:878px;
background-image: url(cms_grafik/back.jpg);
background-repeat: repeat-y;
}
.content{
margin-left: 180px;
float: right;
width: 702px;
height: auto;
background-color: #FAFAFA;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #000000;
}
div#menue {
width: 175px;
height: auto;
float: left;
background-color: #CCCCCC;
margin-right: 10px;
}
/* hier steht fuer dieses beispiel irrelevanter kram */
Alles anzeigen
und nun die index.php:
komischerweise will das ganze nicht mit code-bbtag, deswegen hier als txt-file auszug auf meinem server: auszug der index.php
ich bin mir sicher, die antwort liegt direkt vor meiner nase und ich bin vor lauter augenkrämpfen und rumprobieren nur zu blind, sie zu entdecken -- trotzdem bin ich für jegliche hilfe äußerst dankbar
Aus anschaulichen Gründen habe ich eine Testseite erstellt, an der ihr meine Probleme sehen könnt. In den einzelnen Textabschnitten steht vor den Lorem ipsum Texten immer eine kleine Erläuterung des ganzen. Die Tabelle habe ich mit einem Rahmen von 1px ausgestattet, damit diese deutlich zu erkennen ist.
lieben gruß,
mr.tino