Tag: CSS
CSS (Cascading Style Sheets) is a style sheet language used to define the presentation and layout of HTML or XML documents on the web.
-
HTML: how to vertically center an object with CSS?
Written by
There are several ways to vertically center an object with CSS: Flexbox This method uses the CSS flexbox layout to center the child element vertically within the parent container. The align-items property set to center aligns the child element along the cross axis. Grid Layout This method uses the CSS grid layout to center the…
-
Customizing Bootstrap 4 without changing the core files
Written by
A simple instruction to customize the Bootstrap 4.0 using SASS and Autoprefixer. But why? You can either… When you choose number 2, then it’s necessary to use SASS for compiling the style sheet and Autoprefixer for CSS vendor prefixing. And this is how to get a customized version of Bootstrap: First make sure, you’ve installed Node.js and…
-
Less (CSS) unter macOS installieren
Written by
Der einfachste Weg Less auf einem Server zu installieren ist über npm (dem node.js Paketmanager) mit: $ npm install -g less Wenn nicht vorhanden: Command Line Tools für Xcode installieren xcode-select –install Wenn nicht vorhanden: HomeBrew installieren ruby -e “$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)” Wenn nicht vorhanden: Node.js installieren brew install node LessCSS installieren sudo npm install -g…
-
HTML5 Boilerplate – das Grundgerüst für HTML5
Written by
HTML5 Boilerplate bietet ein kompaktes Grundgerüst zum Gestalten von Webseiten oder wie auch ich es nicht besser ausdrücken kann: HTML5 Boilerplate ist ein professionelles HTML/CSS/JS-Template als Basis für eine schnelle, robuste und zukunftssichere Website.Nach mehr als zwei Jahren Entwicklung, bekommt ihr das beste der besten Techniken zusammengefasst: Cross-Browser-Normalisierung, Performance-Optimierungen und sogar optionale Features wie Cross-Domain…
-
CSS: vertikales und horizontales Zentrieren von Inhalten
Written by
In alten HTML-Zeiten hat man Inhalte noch über Frames oder auch Tabellen auf einer Webseite, sowohl horizontal, als auch vertikal zentrieren können. Da die Gestaltung und Anordnung von Webseiten nun vorwiegend mit CSS realisiert wird, braucht man manchmal ein paar besondere Kniffe, um bspw. Elemente/Inhalte auf einer Webseite zu zentrieren.
-
HTML-Sonderzeichen in CSS content
Written by
CSS ‘content’ akzeptiert keine benannten oder numerischen HTML Sonderzeichen wie © oder ©, diese können wirklich nur in HTML-Quelltext verwendet werden. Um Sonderzeichen in CSS verwenden zu können, muss man auf die Text-Darstellung in ASCII oder Unicode zurückgreifen. In CSS sieht das Ganze dann wie folgt aus: Eine Tabelle mit allen möglichen Unicode-Zeichen (sortiert nach…
-
CSS: Blockelement in HTML5 zentrieren
Written by
Zum Zentrieren eines Blockelementes (<div>) konnte man in HTML4 noch das Attribut align verwenden: <div align=”center”> <div> … Damit wird der zweite div-Block bei Angabe einer festen Breite innerhalb des ersten Blocks zentriert. Mit HTML5 ist allerdings das align-Attribut für div-Elemente nicht mehr zulässig, d.h. das Zentrieren muss in HTML5 über CSS realisiert werden.
-
CSS: Problem beim Rendern von Schriftgrößen in Safari (iPhone)
Written by
Die Safari-Version, welche im iOS (iPhone/iPodTouch/iPad) verwendet wird “ignoriert” teilweise beim Render von Webseiten die mit font-size definierten Schriftgrößen bzw. passt diese automatisch an, um die Lesbarkeit zu verbessern. An bestimmten Stellen ist dies nicht schlecht, allerdings kann das auch zu unschönen Veränderungen am Design führen. Diese automatische Anpassung kann jedoch durch folgende CSS-Zeilen verhindert…
-
CSS: Abschneiden zu langer Texte
Written by
Des öfteren kommt es vor, dass man Text-Ausgaben (beispielsweise für Tabellen) nur gekürzt darstellen möchte. Dies würde sich zwar schon beim Zusammenstellen des HTML-Codes serverseitig realisieren lassen, allerdings führt ein einfaches Abschneiden des Textes nach n Zeichen (besonders bei Nicht-Monospace-Schriftarten) nicht zu einer einheitlichen “Textlänge”. Eine Möglichkeit bietet hierbei die CSS-Eigenschaft text-overflow.