Florence Maurice

Webthemen

shrink-to-fit=no Ergänzung bei der viewport-Meta-Angabe

Bei einer Schulung zum Thema Responsive Webdesign bin ich über die Ergänzung shrink-to-fit innerhalb einer Viewport-Angabe gestolpert.

Weiterlesen ...

Mindestaußenabstand - min-margin faken

Die Eigenschaft `min-margin` gibt’s nicht, aber ein Mindestaußenabstand lässt sich mit `calc()` faken.

Bevor ich dazu komme, aber kurz zur Funktionsweise von max-width. Da gibt es nämlich ein interessantes Verhalten bei untypischen Angaben.

Weiterlesen ...

Modernizr einsetzen - so gehts mit der Version 3

Modernizr-Logo

Modernizr ist unschlagbar, wenn du alternative Formatierungen für Browser durchführen möchtest, die ein bestimmtes neues HTML5/CSS3-Feature nicht verstehen. Die neue Version von Modernizr sieht auf den ersten Blick ganz anders aus als die gewohnte. Die Benutzung ist aber auch nicht komplizierter.

Weiterlesen ...

Zentrieren mit Flexbox - verschiedene Möglichkeiten

zentriertes Element

Mit dem CSS-Layoutmodul Flexbox lassen sich Elemente einfach zentrieren.

Allerdings gibt es dafür unterschiedliche Ansätze: Entweder man verwendet zur Zentrierung die Eigenschaften align-items:center und justify-content: center oder aber man setzt dafür auf die altbekannte Eigenschaft margin.

Weiterlesen ...

isolation: isolate: Das Vermischen bei den Blendmodi genau steuern (CSS3)

will it blend

Gute Nachricht: Firefox 36 unterstützt die Eigenschaft `isolation` bei den Blendmodi. Das habe ich zum Anlass genommen, meinen Artikel zu `isolation: isolate` vom Juni 2014 zu aktualisieren.

Weiterlesen ...

Bildunterschrift an Bild anpassen mit min-content (inklusive IE)

Häufig möchte man, dass die Beschriftung zu einem Bild genauso breit wird wie das Bild selbst - und das soll möglichst natürlich auch dann funktionieren, wenn wir die Breite des Bildes nicht im Voraus wissen. Möglich wird das über den CSS3-Wert `min-content`.

Weiterlesen ...

CSS-Filter

Grafische Filter auf eine Postbox angewendet

An verschiedenen Stellen stößt CSS in Bereiche vor, die vorher Bildbearbeitungsprogrammen vorbehaltet waren. Man kann [Bilder beschneiden mit clip-path](https://maurice-web.de/ausschneiden-mit-css3-clip-path/ "Ausschneiden mit CSS3 – clip-path"), [Bilder und andere Elemente über die Blendmodi mischen](https://maurice-web.de/background-blend-mode-hintergruende-mischen-css3/ "background-blend-mode: Hintergründe mischen (CSS3)") und es gibt die Filter, um Effekte wie Farbverschiebungen oder Unschärfe auf Bilder und andere Elemente anzuwenden. Um diese Filter geht es hier.

Weiterlesen ...