Kopier einfach ein Objekt und verändere den code nach belieben!

Responsive solltest du die 3 Objekte aber früher "floaten" lassen!

So wie ich das sehe, hast Du es im Moment in einem html-Objekt mit einer dreispaltigen Tabelle gelöst. Du könntest natürlich im reiter HTML-Code eine der Spalten (beginn mit "<div class="columns">") komplett kopieren und am Ende einfügen. Damit hast Du schon mal die vier Boxen. Im Reiter Erweitert solltest Du zusätzlich die Spaltenbreite von 33.3% auf 25% setzen. Ob das dann noch gut aussieht musst Du dann entscheiden.

Alternativ kannst Du auch vier Spalten auf der Seite anlegen und in jede der vier Zellen ein Objekt (z.B. Text-Objekt) aufnehmen, das Du dann mit den entsprechenden Inhalten füllst. 

Ich habe den Code hier bekommen.

JEtzt habe ich den div kopiert und unten eingefügt (nicht online)

Jetzt ist eine 4. Box unter den oberen 3.

Aber im Reiter Erweitert steht nichts wegen Breite. Vielleicht kann man auch 2x2 machen aber mit <br> geht es nicht

Im Reiter Erweitert musst du nach width und dem Wert 33.3 suchen und den auf 25 ändern. Für 2x2 solltest Du den Wert auf 50% setzen, das HTML-Objekt kopieren und in einer weiteren Zeile einfügen. Anschließend in beiden HTML-Objekten im Reiter HTML-Code die nicht mehr erforderlichen Inhalte löschen. 

Ich habe das mit width 25 geändert.

Jetzt sind 4 nebeneinander. Das passt soweit. Aber bei responsiv sieht es nicht mehr schön aus.

Da es ein HTML Objekt ist kann ich auch den Umbruch nicht machen für die responsiven Ansichten oder?

Dachte ich mir, dass das nicht schön aussieht. 

In einem Objekt kannst Du keinen responsiven Umbruch machen. Hast Du mal die oben beschriebene Lösung mit den zwei HTML-Objekten untereinander versucht? 

Es würde vermutlich auch mit einer geänderten Tabellenstruktur funktionieren. Aber dazu muss ich mir den Code später noch einmal genauer ansehen (Bin zur Zeit unterwegs und habe keinen PC). 

Hallo Michael,

meine Vermutung war falsch, denn wie ich jetzt gesehen habe, ist der Inhalt nicht als html-Tabelle aufgebaut. Du kannst es also nur über die oben beschriebene Lösung mit den zwei HTML-Objekten realisieren. Der Inhalt steht in drei gleichartigen Code-Schnipseln, die folgendes beispielhafte Aussehen haben:

<div class="columns">
<ul class="price">
<li class="header">MT CLASSIC</li>
<li class="grey" style="background-color:#5a8ec8">Der Klassiker</li>
<li> <img src="files/Profil30mm.jpg" alt="Faltzelt Classic 30mm" title="Faltzelt Classic 30mm" width="30%"></li>
<li>Aluminium</li>
<li>Standbeine 30x30mm/4 Kant</li>
<li>Wand mit Klettband</li>
<li>3 Jahre Garantie</li>
<li class="grey"><a href="faltzelt-classic.html" class="button">Zum Produkt</a></li>
</ul>
</div>

Wie oben gesagt, kopierst Du das HTML-Objekt und fügst es in einer neuen Zeile ein. Dann entfernst Du im oberen HTML-Objekt den unteren <div class="columns">-Bereich und verlässt das Objekt. Dann klickst Du auf das untere Objekt und löschst die beiden oberen <div class="columns">-Bereiche und fügst am Ende den neuen <div class="columns">-Bereich ein.

Und nicht vergessen: Im Reiter Erweitert musst du dZeile width: 33.3%; auf width: 50%; ändern. 

Super danke für deine Hilfe