Matthias Scharwies: Darstellung von Bild, Text, Bild

Beitrag lesen

Servus!

Hallo,
wie kann ich auf einfache Art links ein Bild, in der Mitte einen Text und rechts wieder ein Bild realisieren?

Zuerst denke ich da an die Erstellung einer Tabelle.

Nein!

Nimm Grid Layout

frei adaptiert:

.gallery  {
    display: grid;
		gap: 0.5em;
}

@media (min-width: 45em) { 
	/* Breite beträgt mindestens 45em */ 
	.gallery {
    grid-template-columns: 1fr 2fr 1fr;	
	}
}

Die Werte für fr (Bruchteile) kannst du auch durch em oder px-Angaben ersetzen.

Dein Inhalt wäre so verteilt:

<div class="gallery">
  <img ...>
  <div  class="text">
    <p> ... </p>
   <p>  ... </p>
  </div>
  <img ...>
</div>

Herzliche Grüße

Matthias Scharwies

--
Was ist eine Signatur?