10 Antworten zu diesem Thema

[Atempause]

ich arbeite gerade an meinem Website-Layout und möchte die Abstände in einigen Bereichen reduzieren. Ich habe ein Screenshot beigefügt, auf dem ich die Stellen markiert habe, die ich anpassen möchte. Konkret betrifft es:

1. Die Abstände zwischen den Menü-Elementen in der oberen Leiste
2. Die Lücken zwischen den Produktbildern/Karten
3. Den Abstand zwischen den Hauptsektionen (z. B. "Shop by Dunoon Mug Design") und anderen Elementen.

Ich verwende Page-Builder, bin mir aber nicht sicher, welche Einstellungen oder CSS-Regeln ich anpassen muss, um diese Änderungen umzusetzen.

Hat jemand Tipps, wie ich die Abstände effizient verkleinern kann? Oder welche CSS-Eigenschaften ich genauer prüfen sollte?

Vielen Dank für eure Hilfe! 😊

Grüße,

Neil

[stefanmueller]

Hallo Atempause, der screenshot ist leider nicht zu sehen. Gruß, Stefan

[Atempause]

moin Stefan,

ich glaube jetzt muss der Bild da sein.

grüße

Neil

 

Angehängte Bilder

• 

[Artar]

Hallo Neil,

 

du kannst die Abstände im Layout-Stil definieren.

Dazu können Bootstrap-Klassen verwendet werden:

https://getbootstrap...lities/spacing/

 

[stefanmueller]

Hallo Atempause, wie ich auf deinem Shop sehe, schaut es jetzt kompakter aus. Welche Werte hast du in CSS Klasse eingetragen?

[Atempause]

css-p-o

[Atempause]

css py-o

[Atempause]

Hallo Herr Arter,
vielen Dank für Ihren Tipp – damit konnte ich meine Probleme im oberen Bereich lösen. Nun tritt aber das gleiche Problem unten auf. Könnten Sie mir bitte auch dafür eine Lösung empfehlen?

Danke und viele Grüße!

 

in meinem Shop/Theme sind die Abstände (z. B. Margin/Padding) zwischen den Kürzlich angesehen

und obere bild. zu groß. Ich möchte sie gerne verkleinern, damit alles kompakter wirkt.

Kann mir jemand einen Tipp geben, wie ich das in CSS oder im Template anpassen kann?

Vielen Dank im Voraus!

 

Angehängte Bilder

• 

[Artar]

Löschen Sie zunächst in der mobilen Ansicht (wichtig= mobile Ansicht!) ganz unten die nicht verwendeten Zellen.

 

 

 

 

 

Löschen Sie zunächst in der mobilen Ansicht ganz unten die nicht verwendeten Zellen.

 

Ziehen Sie dann den Schieberegler in Richtung Mobile Landscape.

Dort werden unten ebenfalls freie Zellen angezeigt.

Diese löschen Sie nicht mehr.

Hier verteilen Sie die Blöcke über alle Zellen, so dass keine (unerwünschten) freien Zellen mehr vorhanden sind.

Wenn es in der Mobile View 2 Reihen gibt und in der Mobile Landscape 4 Reihen, ist es normal, dass unten leere Zellen bleiben.

In diesem Fall ziehen Sie die Blöcke einfach nicht über 1 vertikale Zelle, sondern über 2. So werden alle vertikalen Zellen genutzt.

Wenn unten eine Reihe übrig bleibt, kann man auch einen Block über 3 statt über 2 senkrechte Zellen ziehen. Die Größe des Blocks ändert sich dadurch nicht.

 

Freundliche GRüße

Zihni Artar

[Artar]

ich habe das mal in Ihrem Shop in der Kopie der Story für die Mobile Landscape Ansicht gemacht (suchen Sie nach Kopie von shopby...)

 

[Atempause]

super

danke