Jak wyśrodkować tekst pod obrazkiem nie centrując samego obrazka

0

Cześć Wam. Mam laickie pytanie ale nie umiem sobie z nim poradzić. Jak w temacie czyli jak wycentrować tekst pod obrazkiem nie centrując samego obrazka.

U mnie wygląda to tak lecz centruję też obrazek:

<div><img src="img/Obrazek.png"/><br/>tekst</div>

i CSS

div{
	text-align: center;}

No niestety tym sposobem centruje mi też obrazek(zamiast samego tekstu względem szerokości obrazka) chociaż rozumiem dlaczego (text-align: center; jest na każdy element liniowy w divie) Już zagnieździłam drugiego diva i nadałam mu id i jemu dodałam text-align: center; Co prawda obrazek pozostał na miejscu ale tekst wywaliło na środek strony. Myślałam że jak dodam diva w divie to ten w środku przybierze szerokość obrazka i tak o to wycentruje tekst pod i względem obrazka, nie centrując samego obrazka. Więc jak to poprawnie zrobić? Z góry dziękuję za pomoc i pozdrawiam

1
<!DOCTYPE html>
<html>
<head>
  <title>tytul</title>
<style>
div {
    border:1px solid red;
    text-align: center;
}

IMG {
  display:block;
}
</style>

</head>
<body>

<div><img src="https://4programmers.net/img/avatar.png"/>tekst</div>
  
</body>
</html>

1 użytkowników online, w tym zalogowanych: 0, gości: 1