Jörgs Webnotizen

CSS

Link mit CSS deaktivieren

Manchmal kann es sinnvoll sein, einen Textabschnitt nur bei einer bestimmten Bildschirmbreite oder -höhe mit einem Link zu versehen. Wenn beispielsweise in der mobilen Ansicht ein Kontaktformular erst durch Scrollen sichtbar wird, kann man in einer Textbox im oberen, sichtbaren Bereich die Wörter „Kontakt aufnehmen“ in einen Link einbetten, der zu dieser Stelle springt.


<a href="#contact">Kontakt aufnehmen</a>

(mehr …)

CSS 3: Höhe von 100% minus x Pixel

Möchte man eine Seite von der Höhe so aufteilen, dass der Header eine feste Höhe aufweist und der Hauptteil den Rest einnimmt, also genau bis zum unteren Rand des Viewports reicht, so hat man in CSS3 zwei relativ einfache Möglichkeiten dies zu realisieren: entweder mithilfe von calc() oder mithilfe von box-sizing. (mehr …)

Übergroße Buttons in Firefox 46

Version 46 von Firefox bringt für Linux-Nutzer eine GTK3-Integration. Dies macht sich nicht nur in dem geänderten Design der Benutzeroberfläche bemerkbar, auch nicht gestylte Formular-Elemente innerhalb von Webseiten werden mitunter anders angezeigt als vorher. Wenn Webseitenersteller mittels CSS hier keine Vorgaben machen, richtet sich das Aussehen der Formularelemente nämlich nach dem Theme des Browsers / des Betriebssystems. (mehr …)

Chrome und der „background-attachment: fixed“ Bug

In die neuere Versionen von Chrome bzw. Chromium (Version 46.0.2490.71) hat sich wohl ein Bug eingeschlichen, der dafür sorgt, dass ein mit „background-attachment: fixed“ definiertes Hintergrundbild innerhalb eines Containers mit der Eigenschaft „overflow: auto“ beim Scrollen des Containers nicht mehr feststeht, sondern in die entgegengesetzte Richtung gescrollt wird. (mehr …)