Icons/Bilder nebeneinander anordnen (content)

Hallo zusammen,

ich bin etwas am verzweifeln.

Wir bekomme ich auf der Versand- und Zahlungsseiten Payment Icons/Bilder nebeneinander? Shopware stellt sie immer untereinander dar (warum auch immer).

Ich arbeite mit der MeinTheme/frontend/_public/src/less/_modules/ global.less.

Der Code sieht so aus:

usw.....

Und im less file:

div.paymenticonsin {
  display: WERT;
  align-items: left;
  float: left;
}

Egal wie ich display:  anpasse, werden die icons dennoch untereinander ausgegeben. Das Einzige, das geholfen hat, war display: inline-flex. Aber dann gehen die icons links und rechts über den  custom-page–content content block in der mobilen Ansicht hinaus. Ich habe auch unzählige andere Code-Schnipsel in online CSS-Editoren probiert, aber das möchte einfach nicht werden.

Kann mir jemand bitte einen Tipp geben?

Danke!

Leider bin ich da noch nicht weitergekommen.

Hat jemand einen Tipp für mich?

Hallo Andrew,
ersetze den Code von oben vollständig durch:

.paymenticonsin img {
	display: inline;
}

Du sprichst den Container an, der die Bilder beinhaltet. Du musst aber die Bilder innerhalb des Containers ansprechen.
Wenn dich die Abstände zwischen den Bildern stören kannst du noch folgenden Code hinzufügen:

.paymenticonsin {
	font-size: 0;
}

Der erste Code ändert das Verhalten der Bilder. Diese werden danach wie Text behandelt. Mit font-size: 0 im Container werden die Lücken zwischen den Bildern (Leerzeichen) auf 0 gesetzt.
Viele Grüße

2 „Gefällt mir“

Oh Mensch, danke sehr. Jetzt klappts  Smile

Bin da einfach nicht draufgekommen  Crying