Element braucht ein Margin Auto nach links!
margin-left: auto;Code-Sprache: HTTP (http)Kategorie: CSS
CSS Grid Content Center
display: grid;
place-content: center;Code-Sprache: HTTP (http)Resposive Text basierend auf Bildgröße
<div class="box">
<img>
<h1>Lorem ipsum dolor ..</h1>
</div>Code-Sprache: JavaScript (javascript).box {
display: inline-block;
}
h1 {
width: 0;
min-width: 100%;
}Code-Sprache: CSS (css)Die umgebene Box auf display-inline setzen, damit Sie die Größe Ihrer Kindelemente annimmt.
Die Überschrift, bzw. das Textelement auf width: 0 setzen, damit es nicht mehr automatisch die Breite des Eltern-Containers übernimmt.
Das Textelement (h1) auf min-width: 100% setzen, damit es die Größe des Bildes annimmt.
Gulp – primordials is not defined
Beim Ausführen von Gulp erscheint folgende Fehlermeldung
primordials is not defined
Problem ist das Gulp 3 und NodeJS > 10 nicht miteinander kompatibel sind.
Dafür gibt es einen Workaround.
- Im Verzeichnis der package.json eine Datei npm-shrinkwrap.json anlegen
- In der Datei folgenden Eintrag hinterlegen
- npm install ausführen
- gulp sollte wieder funktionieren
{
"dependencies": {
"graceful-fs": {
"version": "4.2.2"
}
}
}Code-Sprache: JSON / JSON mit Kommentaren (json)iPad CSS Breite der Webseite nicht korrekt
Um auf dem iPad die Seite bzw. alles ab Tag html auf die komplette Breite zu bekommen, müssen folgende Metatags integriert werden
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0"/> <meta name="apple-mobile-web-app-capable" content="yes"/> <meta name="apple-mobile-web-app-status-bar-style" content="black"/>