Zitat von
Caostao
Hier tu ich mich momentan etwas schwer wo welcher Tag <e.g. #main> zuhause ist und wo welcher Befehl wirkt.
???
Momentan sehe ich dass Mainzuodnung der Texteinrückung/Rahmen in der Hauptspalte und in der linken Spalte wirkt, der Hintergrund und Schattierung jedoch nur in der Hauptspalte zu sehen ist
Werde mal versuchen die verschiedenen Tags irgendwie im Hauptprogramm zu finden, vielleicht ist es viel einfacher über die Vererbung zu erklären wie gedacht.
#main -> Hauptspalte
#left -> Linke Spalte
#right -> Rechte Spalte
Was du im CSS einer Spalte zuweist, gilt nur für diese Spalte und nicht für die anderen. Ich weiss nicht, wie dein Layout für den Test aussieht. Ich kann dir nur als großartiges Hilfsmittel, gerade auch zum Verständnis solcher Dinge, die Entwicklertools deines Browsers ans Herz legen. Damit kannst du deine Spalten und überhaupt alle Elemente sehr leicht im Browserfenster wiederfinden (oder auch umgekehrt angezeigte Objekte im HTML finden) und ihre zugewiesenen Rigenschaften sehen - und auch direkt "live" zu Testzwecken verändern. Aufrufen kann man die zumindest bei Firefox und Google Chrome entweder mit F12 oder indem man das gewünschte Element mit der rechten Maustaste anklickt und dann "Element untersuchen" oder "Untersuchen" auswählt.
Was verstehst du unter Texteinrückung? text-indent oder eventuell margin-left bzw padding-left? Wenn du schreibst, die #main zugewiesenen Rahmen bzw Texteinrückung wirkt sich auf die linke und die Hauptspalte aus, dann habe ich den Verdacht, dass sich deine linke Spalte momentan nicht da befindet, wo du sie vermutest. Entweder sie fehlt komplett, was daran liegen kann, dass sie keine Inhalte hat, oder sie ist unter die Hauptspalte gerutscht. Das kann z.B. passieren, wenn man der Hauptspalte (#main) einen Rahmen (border) zuweist, wodurch dies breiter wird und somit für die linke Spalte links davon nicht mehr genug Platz bleibt. Das sind ja eigentlich auch keine "Spalten", sondern einfach irgendwelche Container, die durch CSS als Spalten formatiert werden. Wenn diese Formatierung nicht mehr passt, kommt es zu solchen Verschiebungen. Abhilfe: border, margin, padding nicht der Spalte selbst, sondern dem darinliegenden Inside-DIV zuweisen. Also statt
Code:
#main {
padding-left: 10px;
}
was zwar #main einen linken Innenabstand von 10px zuweist, aber gleichzeitig auch #main um 10px breiter macht, besser
Code:
#main .inside {
padding-left: 10px;
}
Die ganzen Inhalte wie Textelemente usw werden sowieso innerhalb der Inside-DIVs ausgegeben. Einfach mal im Entwicklertool anschauen.
Lesezeichen