как в конец текста добавить изображение,что бы оно не смещало текст
есть текст в конц которого надо добавить изображение
<p> adqadadadadadadsfgdfg
asdasdasdasdasdadasdasd
</p>
так как верстку начал изучать не давно столкнулся с проблемой(скорее всего не очень серьёзный,однако решить ее не получается) нужно вставить изображение в конец текста так что бы оно не смещало верхнюю строчку текста
Ответы (1 шт):
Автор решения: Neverm1ndo
→ Ссылка
Для того, чтобы разместить картинку в строке, не обязательно оборачивать img в span. Для этого существуют css свойство display и его значения inline и inline-block(legacy).
Для того, чтобы блок с типом отображения inline был по центру строки есть свойтво vertical-align и значение middle. Подробнее про vertical-align.
Для того, чтобы крупный inline блок вмещался в строку, нужно либо уменьшить высоту изображения, либо увеличить высоту строки с помощью свойства line-height.
.article__text {
width: 200px;
overflow-wrap: break-word;
line-height: 22px; /* высота строки */
}
.article__text img {
display: inline; /* тип отображения */
vertical-align: middle; /* вертикальное расположение по середине строки */
margin: 0px 0.5em 0px 0.5em; /* отступы слева и справа */
}<div class="article__text">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAYAAAByDd+UAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABrSURBVHgB7dXBCYAwDAXQ1DVyriNkKruUHSrYNTKAkoKeFKGUHvR/yCEh8CgUEuYYdxqYiQYHIECAAP8ILinRVgqtOV8z771E5HGnGeyd8HaemLmWmZGq1tn5Mu99frfTDPYOfilAgAA/CB7mMCe1CJgCegAAAABJRU5ErkJggg==" />
</p>
</div>