Einfache CSS-only Hacks, die Zeit sparen

JavaScript ist mächtig – aber manchmal reicht eine clevere CSS-Zeile völlig aus.
Hier sind ein paar Tricks, die du sofort einsetzen kannst:

🎨 1. Akkordeon ohne JS

<details>
  <summary>Mehr anzeigen</summary>
  <p>Hier ist der versteckte Inhalt.</p>
</details>

🧪 2. Dark Mode (automatisch)

@media (prefers-color-scheme: dark) {
  body {
    background: #121212;
    color: #eee;
  }
}

🎯 3. Responsive ohne Breakpoints

.container {
  max-width: 600px;
  margin: auto;
  padding: 1rem;
}

🧠 4. Visuell verstecken (aber für Screenreader sichtbar)

.visually-hidden {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

🪄 Fazit

Viele kleine Probleme lassen sich ohne JavaScript lösen.
CSS kann mehr, als man denkt – wenn man es lässt.