Hi,
ich würde gerne ein Bild auf der Seite haben, das von Text umflossen werden soll. Das Bild hat zwar 480 auf 640 Pixel, ist also 3:4 von der Größe her, aber es soll responsive sein, sich also anpassen, gerne auch bis es effektiv nicht mehr erkennbar ist.
Dann würde ich gerne etwas auf das Bild schreiben, mittig vertikal wie horizontal.
Also hab ich bissi rumprobiert und geforscht, aber irgendwie komme ich nicht zum gewünschten Ergebnis.
hier mal der bisherige Code
css
#bildrechts {
float: right;
background: url(../img/bild.jpg) no-repeat center;
background-size: cover;
margin-right: 2em;
width: 24vw;
height: 32vh;
text-align: center;
vertical-align: middle;
font-size: 2em;
font-variant: small-caps;
font-weight: bold;
font-style:italic;
color:#fff;
}
in html
<div id="bildrechts">das ist mein Text</div>
hmmm... was funktioniert ist, dass das Bild als Hintergrundbild kommt, allerdings nicht in der Größe in der ichs gerne hätte und der Text kommt ist aber nicht vertikal mittig.
Mit dem Bild, das leuchtet mir ein, klappt das nie mit height:32vh weil ja das Display sich ändert. Ich hab also auch schon width fixe größe und height 100% und auto ausprobiert, damit das bild hat so hoch wird, dass es voll angezeigt wird, abhängig von der vorgegeben Breite. Aber auch das will nicht klappen.
Irgendwie streckt das bissi der Wurm drin und ich will und will nicht drauf kommen.
Weiß jemand Rat?