2 Bilder nebeneinander platzieren innerhalb Frage

Question

Hallo zusammen,

ich würde gerne innerhalb einer Frage 2 Bilder platzieren.

Bisher habe ich folgenden Code verwendet, auf den ich bereits sehr stolz bin (weil Technik-Idiot), wobei die Bilder jedoch untereinander angezeigt werden:

<div style="text-align: center; margin: 40px 0">
  <img src="Joghurt_NuSc-C-min_1_1.png" alt="Bild einer Frau" style="max-width: 100%">
</div>

<div style="text-align: center; margin: 40px 0">
  <img src="Joghurt_NuSc-no-min.png" alt="Bild einer Frau" style="max-width: 100%">
</div>

Kann ich diesen Code irgendwie ausbauen, damit die Bilder nebeneinander erscheinen und nicht jeweils die gesamte Seite einnehmen?

Besten Dank im Voraus und viele Grüße

Answer 1

Sie können mit CSS-Flexbox arbeiten (display: flex), um die beiden Block-Elemente <div> nebeneinander zu platzieren:

<div style="display: flex;">
    <div style="text-align: center; margin: 40px 0; flex-basis: 50%; min-width: 200px;">
      <img src="Joghurt_NuSc-C-min_1_1.png" alt="Bild einer Frau" style="max-width: 100%">
    </div>
    
    <div style="text-align: center; margin: 40px 0; flex-basis: 50%; min-width: 200px;">
      <img src="Joghurt_NuSc-no-min.png" alt="Bild einer Frau" style="max-width: 100%">
    </div>
</div>

Comments

Das klappt perfekt, vielen lieben Dank!