Trick # 130 | Dieser Beitrag beinhaltet 0 Wörter. – Geschätzte Lesezeit: ca. 0 Minuten.
Der Inhalt von Websites, welche mit dem Divi-Theme erstellt werden wird auf mobilen Geräten mit einer maximalen Breite von 80 Prozent der Anzeigenbreite dargestellt. Mit CSS-Code können Sie diesen Wert jedoch ganz einfach verändern.
Fügen Sie folgenden Code in das CSS-Stylesheet Ihrer Website ein. Sie finden es unter Design/Customizer/Zusätzliches CSS:
@media only screen and (max-width: 980px) {
#top-header > .container,
#main-header > .container,
#et_search_outer > .container,
body.single #main-content > .container,
body.page:not(.et-tb-has-template) div.et_pb_row,
body.page.et-tb-has-template .et-l--post div.et_pb_row,
body.single-project div.et_pb_row,
body.single-project div.et_pb_row.et_pb_row_fullwidth {
width: 90% !important;
}
}- Dieser Code wirkt bei einer Anzeigenbreite von maximal 980 Pixel (Zeile 1) - dies betrifft also vorab Tablet und Mobiltelefonansichten. Natürlich können Sie auch eine andere Breite als Breakpoint definieren.
- Anschliessend folgt eine Menge CSS-IDs und -Klassen. Diese sollten Sie unverändert übernehmen.
- Interessant wird's auf Zeile 10: Dort werden mit obigem Code 90 Prozent als Contentbreite definiert. Diesen Wert können Sie nach eigenem Gusto anpassen.
Das war's auch schon. Gar nicht schwierig. Oder?
Werbung
Normalerweise stellt Divi die zu präsentierenden Inhalte mit gebührendem Abstand an. Jedoch lassen sich auch mit dem Divi-Theme Inhalte überlappen - etwa Textblöcke. Wie's geht, zweigen wir Ihnen heute.
Die Module Portfolio und filterbares Portfolio des Divi-Themes haben einige Einschränkungen: Der Titeltext und der Metatext (Kategorie) befinden sich unter dem Bild. Was aber, wenn Sie das ändern und auf dem Bild platzieren möchten? Dafür gibt ...
Heute bauen wir einen Bild-Slider, der ideal geeignet ist, um einen Vorher-Nachher-Effekt darzustellen. Mit HTML, CSS und JavaScript können wir einen Schieberegler erstellen, der es den BenutzerInnen ermöglicht, zwei Bilder zu vergleichen. Ein ...
Heute zeigen wir Ihnen eine kleine Verbesserung, die Ihrem Designprozess zu mehr Effizienz verhelfen kann. Wir zeigen Ihnen wie Sie die Standardhöhe (min. und max.) und die Standardbreite (min. und max.) des Builder-Popups im Divi-Theme ...
Keine Inhalte gefunden.
Werbung
