How to make the coffee image close to the text?example as it should be
.cup {
float: right;
}
.mbc {
font-size: 60px;
}<div class="page1">
<div>
<div>
<h1 class="mbc">Make better<br>coffee<img src="Coffe.png" alt="Coffe image" width="70px" height="67px" class="cup"></h1>
<p>why learn how to blog?</p>
</div>
<img src="Croods.png" alt="Croods" width="476px" height="323px">
</div>
</div>
>Solution :
Right now, float right makes the image always go to the right side. If the image is positioned inline (display: inline, which is the default value), the image would be placed correctly.
<h1>This is<br/>your text<img width="30" style="margin-left: 10px" src="https://hotemoji.com/images/dl/d/coffee-emoji-by-twitter.png" /></h1>