Frage zu CSS und <img> Tag

[Gunnar Bittersmann]

@@Passwort

• Bild und Text sollen als Ganzes zentriert sein („(da)neben“):

  header
  +------------------------+
  |   +------+             |
  |   | Bild | Text Text   |
  |   +------+             |
  +------------------------+
  

Entweder so

Da genügt im einfachsten Fall header { text-align: center }.

oder auch:

+------------------------------------+
|              +------+              |
|              | Bild |     Text     |
|              +------+              |
+------------------------------------+

Das ist ein Fall für CSS-Grid.

Flexbox, wenn das Bild in der Mitte des neben dem Text freien Platzes stehen soll.

Siehe Sildes 19 und 20 und die Codepens flexbox, grid.

aber so nicht:

+------------------------+
|        +------+        |
|        | Bild |        |
|        +------+        |
|        Text Text       |
+------------------------+

So nicht? Wie sonst? Hast du dir Gedanken gemacht, wie es auf schmalen Viewports aussehen soll, wenn Bild und Text nicht nebeneinander passen?

🖖 Живіть довго і процвітайте