Kalender CSS

  • Hallo allerseits! :)



    Ich habe einen Kalender in PHP programmiert, und versuche nun seit geraumer Zeit den ordentlich darzustellen.
    Das Styling ist kein Problem, jedoch mit der Darstellung.


    Folgendes:
    Bei Terminen die über mehrere Tage eingetragen sind, wird der Termin nicht jeden Tag angezeigt,
    sondern ich möchte dass ein langer Balken über die ausgewählten Tage geht.
    Ich hab das jetzt so gelöst, dass ich für jeden weiteren Tag einmal einen "leeren" Eintrag anzeige, der links und rechts keine Border hat.


    Wie ihr im Anhang 1 sehen könnt, wird der erste Eintrag "Besuch von Verwandten" auch gut dargestellt.
    jedoch wie erwartet klappt das beim 2. Eintrag "Wanderung" nicht mehr. Beim ersten Tag wird logischerweise der Eintrag unter dem anderen angezeigt,
    beim zweiten Tag jedoch steht der Eintrag wieder ganz oben.



    Der Quelltext ist nicht sehr spannend, deswegen glaub ich nicht dass es notwendig ist den hier zu posten.
    Ist eine normale <table> und im <tbody> steht in jedem <td> des Tages, andem in der Datenbank ein Eintrag steht ein <div>Wanderung</div> mit dem Titel darin.


    Ich habe mir überlegt, ob ich einfach ein "blind div" an der ersten Stelle erstellen soll, aber die Lösung gefällt mich nicht sehr.
    Ausserdem würde das den Platz wegnehmen, für ein Eventuelles anderes Event an dem Tag.


    Apple hat das in ihrem "Kalender" so gemacht, wie ich es gerne hätte.
    Im Anhang 2 und 3 seht ihr ein Beispiel.


    Gibt es eine ordentlichere Möglichkeit das sauber und gut umzusetzen?
    Falls noch Fragen sind, oder ihr noch informationen benötigt, schreibt einfach!
    lg. und Vielen Dank im Vorraus!

  • Das ist prinzipiell nicht möglich aufgrund der Struktur von HTML (die Verschachtelung).
    Es gibt aber ein kleines work-around..: Und zwar gibst du via deines PHP dem Event die klasse (isFirst|isFollowing|isLast) und kannst dann mit CSS eben mal ne border und mal nicht darstellen..
    Außerdem musst du mit dem PHP halt prüfen auf welcher (visuellen) Höhe das Element liegt..

  • Hey,
    vielen Dank mal für die Antwort!


    Ja genau so hab ich das gemacht... 3 KLassen "start" "middle" und "end"
    die Höhe des Elements war nur das Problem.
    aber wenns nicht anders geht, dann muss ich mir was in PHP dazu überlegen!!
    Vielen Dank trotzdem!


    lg. :)

  • du musst einmal alle Tage durchlaufen und immer die events am tag (vor dem eigentlichen Event) merken.. dann zählt die gröste Zahl .. das ist ein bisschen komplexer noch aber ich denke das ist der weg..

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!