HangTab: Erstellen Sie ein klebriges Tag am Rand des Browserfensters (auch mit zentriertem Inhalt)

Es ist heutzutage eine sehr gesunde Technik, Ihre gesamte Website horizontal im Browserfenster zu zentrieren (aber seien Sie vorsichtig), besonders heutzutage, wo die Monitore immer größer und mit höherer Auflösung werden. Manchmal ist es jedoch schön, die Regeln für den Effekt zu brechen. Schauen Sie sich die Website von Panic für ihre Software Coda an.

Dies ist bei einem ziemlich kleinen Browserfenster

[BILD FEHLT, Entschuldigung]

Und das ist, wenn das Browserfenster auseinandergezogen ist

[BILD FEHLT, Entschuldigung]

Der "Hangtab" ist nur ein absolut positioniertes div

#hang_tab {
  position: absolute;
  top: 7px;
  left: 0;
  width: 157px;
  height: 93px;
}

Hier ist die CSS-Tricks-Version. Laden Sie sie gerne herunter und verwenden Sie sie frei.

Demo ansehen

Dateien herunterladen