Shopseiten mit Bildern responsiv gestalten

Hallo zusammen, ich erstelle gerade einige Shopseiten neu und möchte hier auch Bilder einfügen. Z.B bei den Zahlungsarten mit verschiedenen Logos. Nun wollte ich die Bilder und Inhalte nebeneinander stellen weil das in der Dektopansicht schöner aussieht und habe das mit einer Tabelle gemacht. Doch leider sind diese dann nicht responsiv, das bedeutet bei kleineren Bildschirmen werden die Bilder und Inhalte dann nicht untereinender gesetzt, sondern werden rechts abgeschnitten. Wie erstelle ich denn hier responsive Inhalte? Viele Grüße Alexander

Tabelle raus und je nach Breakpoint die Bilder inline darstellen oder als block.

Es wäre interessant zu wissen, wie die Bilder angeordnet werden sollen. Sagen wir mal, 3 nebeneinander: In einen Container packen - z.b.

  • Style für
  • : float: left; width: 33%; box-sizing:border-box; Style für img im
  • : max-width:; width:100%; border:none

und für kleine viewports dann umbrechen - anderes CSS

Wäre ein Ansatz

Hallo zusammen,

und wie definiert ihr Breakpoints in den Shopseiten? Also mit Inline-CSS? Das schmeißt der WYSIWYG-Editor nämlich schön raus.

Meine Autoren haben kein Zugriff auf “externe” CSS bzw. less-Files.

Beste Grüße
Sebastian