Hallo
Zitat:
|
Ich hoffe, ich habe es verständlich beschrieben.
|
Ich befürchte leider nicht.
Das aktuelle Vorgehen dazu ist, das img-Element mit dem Bild und das figcaption-Element mit dem Text in ein figure-Element zu schreiben. Per CSS mittels Flexbox wird der Text dann über dem Bild angezeigt und per text-align mittig ausgerichtet.
HTML:
Code:
<figure>
<img src="http://pfad/bild.jpg">
<figcaption>Text über dem Bild</figcaption>
</figure>
CSS:
Code:
figure {
min-width: 0;
margin: 0;
display: flex;
flex-direction: column-reverse;
}
figcaption {
font-size: 1.2rem;
text-align: center;
}
img {
display: block;
min-width: 0;
max-width: 100%;
max-height: 100vh;
border: 0;
}
Und ein Beispiel direkt zum Ausprobieren:
Text über Bild
Nachtrag: Wie Killerbear schrieb habe ich die Frage wohl falsch verstanden - Diesen Beitrag also bitte vergessen. Ich lasse ihn bestehen damit Killerbears Beitrag nicht aus dem Zusammenhang gerissen wird. Mein Online-Beispiel habe ich aber korrigiert.
Gruss
MrMurphy