Почему не получается перенести фотографию в правый край?

Question

[njjdnd]

<section class="DOTA2">
            <div class="imgdota2">
                <img src="./img/DOTA2.png" alt="">
            </div>
            <div>
                <p>
                    <!-- тут будет текст, который должен нахотиться по центру -->
                </p>
            </div>
        </section>

.DOTA2 {
  display: flex;
  margin-top: 10px;
  background-color: rgb(224, 136, 29);
  border-radius: 10px;
  height: 400px;
}


.imgdota2 img {
  width: 456.93px;
  border-radius: 10px;
  height: 100%;
  margin-left: auto;
  align-self: start;
}

пробовал и с "display: block" - не работает

Comments

[Ivan Ustûžanin]

а с какого перепоя img реагировать на свойства для флекс-детей, если img таковым не является?

[Ankhena]

Почему не получается перенести фотографию в правый край?

Потому что нет ни одного свойства, которое бы его туда отправило.

Может помочь вот это https://flexboxfroggy.com/#ru
И потом это https://habr.com/ru/articles/329820/

Answer 1

[Матвей Рогов]

<p>
<img src style="text-align: right="./img/DOTA2.png" alt="">
</p>

Answer 2

[Денис Дрозд]

.DOTA2 {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-top: 10px;
background-color: rgb(224, 136, 29);
border-radius: 10px;
height: 400px;
}

.imgdota2 img {
width: 456.93px;
border-radius: 10px;
height: 100%;
}