Adventskalender 2019

  1. 23

    Adventskalender-Tutorial Teil 2

    die Komfort-Variante unseres Adventskalenders mit PHP

    von Matthias Apsel

  2. 12

    Checkbox und Label

    Checkboxen, die mit ihrer Beschriftung immer in einer Zeile bleiben.

    von Rolf B

  3. 8

    Geraden in der Ebene

    In wieviele Gebiete kann eine Ebene durch n Geraden geteilt werden?

    von Matthias Apsel

  4. 3

    Quintupelspielerereien

    Aus Anlass der Veröffentlichung von V5 unseres Forums eine mathematische Spielerei.

    von Matthias Apsel

  5. 15

    Two Prisoners In Paradise

    Die Gefangenen stellen sich im Kreis auf und durch fortlaufendes Abzählen wird jeder dritte wieder in die Zelle zurückgeschickt.

    von Matthias Apsel

  6. 5

    Ausklappbare Navigation

    Eine Navigation (nav ul), die auf kleinen Viewports hinter einem Button verschwindet.

    von Gunnar Bittersmann

  7. 2

    Feststehender Footer

    Wenn Header und Footer ständig im Viewport bleiben sollen, dann ist position: sticky das Mittel der Wahl.

    von Gunnar Bittersmann

  8. 9

    "read-More"-Toggle

    Ein Umschalter, der per CSS weiteren Text / Listenelemente ein- und ausblendet.

    von Gunnar Bittersmann

  9. 22

    Adventskalender-Tutorial

    Wie baut man eigentlich so einen Adventskalender?

    von Matthias Scharwies

  10. 1

    SVG skalieren

    Ich hab mal ein Beispiel gebaut, in welchem dasselbe Symbol zweimal in unterschiedlichen Größen verwendet wird.

    von Gunnar Bittersmann

  11. 14

    Tabellenspalten markieren

    Im verlinkten Thread gibt es mehrere Beispiele, wie sich Tabellenspalten bei :hover markieren lassen.

    von Gunnar Bittersmann

  12. 19

    klickbare Flächen vergrößern

    Die klickbare Fläche wird mit absolut positioniertem a::after-Pseudoelement auf die Größe der Box ausgedehnt.

    von Gunnar Bittersmann

  13. 21

    Listen im Tabellen-Look

    Listen lassen sich wie Tabellen stylen. Custom Elements sorgen dafür, dass die Adressen untereinander stehen.

    von Gunnar Bittersmann

  14. 18

    feste Breite mit flexiblem Padding

    header kann links und rechts padding haben und Flexbox sein.

    von Gunnar Bittersmann

  15. 7

    Überschrift mit Rand

    Eine Überschrift, deren Rand nur so lang wie der Inhalt ist → geht mit max-width: max-content

    von Gunnar Bittersmann

  16. 10

    Flexbox-Achsen

    Wovon hängt ab, ob die Blockachse vertikal oder horizontal ist?

    von Gunnar Bittersmann

  17. 20

    Barrierefreie Formulare

    Die Spec verbietet nicht details in label; details ist ja kein labelable element.

    von Gunnar Bittersmann

  18. 4

    Speisekarte mit Punkten

    Eine Beschreibungsliste (description list dl), deren Elemente jeweils links und rechts zentriert und durch Punkte verbunden sind.

    von Gunnar Bittersmann

  19. 17

    Blockzitat mit Zierelementen

    SVG zu Hilfe! Damit kriegt man schnell zwei Linien hin und auch das Anführungszeichen dazwischen.

    von Gunnar Bittersmann

  20. 13

    Freitag, der 13.

    Der längste Abstand zwischen zwei solchen Freitagen beträgt 61 Wochen - zum Beispiel von Oktober '18 bis ?

    von Christian Hesse, zeit.de

  21. 6

    Header links neben Text

    Ein Header mit einem teaser, der mit Grid links neben dem Haupttext angeordnet wird.

    von Gunnar Bittersmann

  22. 24

    SELFHTML sagt Dankeschön

    für eine Reihe von Zuwendungen und Fördermitgliedschaften.

    von Matthias Apsel

  23. 16

    Buttons gestalten

    Vielleicht nicht die beste Idee, einen Button nicht aussehen zu lassen wie einen Button.

    von Gunnar Bittersmann

  24. 11

    Terminkalender

    Ein Terminkalender mit grid, der die Termine automatisch anordnet.

    von Gunnar Bittersmann