Forum

[TiCar]

Hi,

nachdem ich jetzt schon mehrer Stunden damit verbracht habe CSS auf selfhtml.org durchzulesen, das Template in diversen Dingen versucht habe zu ändern, muss ich nun doch hier um eine kleine Hilfestellung bitten.

Aufbauend auf dem Default Template der Demo habe ich für ein Kumpel mein erstes Redaxo Projekt gestartet und für ein eine kleine Page gebaut.

Bisher klappte auch alles wunderbar mit den Anpassungen bis auf eine Sache. Ich bekomme es ums verr... *$"%&$&* nicht hin das sich die Fußzeile und die Navileiste dem Content anpasst D.h. ist der Inhalt zu lang schreibt er sich über die Fußzeile hinaus drüber, in der noch 2 weiter feste Links steht (Impressum & Admin) und sieht dann sehr unschön aus.

Hier die Page http://ticar.sytes.net/let-tuning.de und hier das mißglückte Beispiel http://ticar.sytes.net/let-tuning.de/in ... icle_id=16

Ich hoffe ihr könnt mir etwas weiterhelfen, da ansosnten die Page bis auf paar Kleinigkeiten dann nämlich fertig ist.

[svenalbert]

zuerst mal, hast du hier nen fehler - kein = sondern einen doppelpunkt.

Code: Alles auswählen

.footer {
   position=static;

warum positionierst du eigentlich statisch, das ist die default-einstellung und kann quasi weg gelassen werden.


wenn ich noch was finde, dann editiere ich den post hier.


EDIT

Code: Alles auswählen

#main-block2 {
   position: absolute;

Absolut positionierte Elemente sind außerhalb des normalen Textfluß, sie liegen über den anderen Elementen und beeinflussen somit nicht ihr Layout.

siehe: http://www.css4you.de/position.html

ich glaube deswegen schreibt er dir deinen content über den footer weg.


außerdem sind so auch noch ein paar fehlerchen in deinem css. z.b.

Code: Alles auswählen

   border-right-width: 0px;
   border-right-width: 1px;

im #main-block2

[TiCar]

Hi Sven,

vielen Dank für die schnelle Hilfe - war genau richtig. Kannst du mir noch ein Tipp geben, wie ich die Navileiste dann noch dazu überreden kann, das sie sich in gleichem Maße vergrößert wie der Content groß ist, sozusagen verknüpfe?

Das mit dem Footer war nur ein Test. Man versucht viel wenn man viel liest und der Tag lang ist und man nicht auf das richtige Ergenis kommt Auch hier danke für den Hinweis. Steh leider noch am Anfang von CSS Laayoutseiten, muss ich zu meinem Bedauern zugeben. Bisher hab ich immer mit Tabellen gearbeitet. aber man will ja vorankommen und dazulernen

[gfc]

das geht via relativen Grössenbezeichnungen. "em" ist dafür geeignet. Als beispiel:

titel {
font-size:2em
}

untertitel {
font-size: 1,5em
}

Text {
font-size: 1em
}

mehr dazu u.a. hier: http://de.selfhtml.org/css/eigenschafte ... ine_height

[TiCar]

Hi gfc,

wenn ich das richtig verstehe geht es hier um Zeilenabstand und Schriftgröße. Darum geht es mir aber gar nicht, sondern wenn du mal obigen Link anklickst (geht jetzt wieder weil ich gestern mein Rechner umgebaut habe), siehst du sofort das der Navibereich zu klein ist wenn der Content größer wird als die Hintergrundgrafik. Man sieht es sehr gut an den Umrandungsstrichen.

[gfc]

warum lässt du den strich bei der Navi nicht weg und machst stattdessen ein grosses div mit Umrandung um den ganzen Inhalt?

[TiCar]

Funzt

Bin halt noch nicht so fit mit den DIV's und muss mich erst noch an diese Gestalltungsmöglichkeit üben, d.h. es felt mir da auch noch an Lösungsideen leider. Aber dafür hab ich ja euch *freu*

Vielen Dank

[glOOmyART]

Hi

Hatte auch dieses Problem das sich der Content über den Footer geschrieben hat.

Die einfachste Lösung ist im CSS den Footer wie folgt zu deklarieren:

Code: Alles auswählen

#footer{
width: 100%;
float: clear;
}

somit wird der Footer über die ganze Seitenbreite angezeigt und lässt keinen Fluss zu, d.h. der Footer "schiebt" sich angepasst an die letzte "div" nach unten.

Anmerkung: Der Code auf einer Seite wird, wenn nicht speziell so programmiert, immer fortlaufend abgearbeitet... Das heisst auch die "DIVS" werden von OBEN NACH UNTEN und von RECHTS NACH LINKS FORTLAUFEND dargestellt...

Hoffe das war einigermassen verständlich.. :p

greez

STAY GLOOMY!!!

http://www.gloomyart.net