Beim responsiven Webdesign geht man üblicherweise von einer HTML-Basis aus, die Anpassungen an die unterschiedlichen Viewportbreiten finden über Media Queries, d.h. über CSS statt. Das Problem dabei ist, dass auf einem klassischen Desktop-Monitor wesentlich mehr Platz zur Verfügung steht, als bei einem klassischen kleinen Smartphone-Screen.
CSS3-Transformationen sind eine schöne Sachen. Hinter die Eigenschaft `transform` schreibt man die gewünschte Operation wie beispielsweise `rotate()`, um ein Element zu drehen, oder `scale()`, um ein Element zu vergrößern bzw. zu verkleinern. Man kann aber auch Elemente damit spiegeln.
Wenn eine Formatierung nicht bei einem Element ankommt, so kann das die unterschiedlichsten Ursachen haben. Zuerst sollte man immer in die Entwicklertools kontrollieren, ob dort die CSS-Deklarationen irgendwie beim Element auftauchen. Dafür ruft man die Entwicklertools auf (Klick mit rechter Maustaste und "Untersuchen" oder Ähnlich). Dann wählt man das Element im HTML-Teil links aus und kontrolliert die CSS-Regeln im rechten Bereich. Wenn die Angaben überhaupt nicht vorkommen, bedeutet das, dass es entweder einen Tippfehler beim Selektor gibt oder - bei zusammengesetzte Selektoren - dass die Verschachtelung nicht stimmt.
Heute sieht man häufiger folgendes Scrollverhalten: Oben gibt es einen fetten Header und darunter die Navigation. Beim Scrollen verschwindet der Header irgendwann, die Navigation bewegt sich beim Scrollen nach oben - und bleibt dort stehen. Sie verhält sich in dem Moment, wo sie oben anbekommen ist, wie ein mit `position: fixed` positioniertes Element. Zu Beginn jedoch, solange sie auch normal sichtbar ist, bewegt sie sich beim Scrollen normal mit.
Wenn ich in meinen CSS-Kursen vorstelle, wie man mit Hintergrundbildern arbeitet, werde ich recht oft gefragt: "Und kann man auch angeben, dass ein Hintergrundbild nur zwei Mal oder drei Mal wiederholt wird? Also die exakte Anzahl festlegen?"