How to position text on the right side from the photo?

Good day to all. The impression that the question is trivial, but I have stalled... it would Seem easier to can't - there's a picture in the div and have the text (also in a div). It remains to set them display: inline-block; and everything is OK - they will be there. But no. Already in span's wrapped and Floatel - all by. In the adaptive version does not want to be near. How can I fix it?

1b554ce0ca5a49c6a79ff813d659bdd4.png
<div class="news-wrapper">
 <div class="foto">
 <img src="img/face.jpg" alt="face">
</div>
 <div class="news">
 As the man unexpectedly passed a way from mulligans English to widely known in very narrow circles of the translator
</div>
 </div>
July 12th 19 at 16:48
3 answers
July 12th 19 at 16:50
Solution
.foto{
float:left;
}

codepen.io/anon/pen/eZQYNo
Thanks for the reply! Helped, but it led immediately to another question) - Madelyn.Howe commented on July 12th 19 at 16:53
: perhaps as an offset from photos to do?) - Maverick_Cummerata commented on July 12th 19 at 16:56
July 12th 19 at 16:52
Solution
https://jsfiddle.net/cc1w7agL/

.news-wrapper {
 display: flex;
}
Thank you! - Madelyn.Howe commented on July 12th 19 at 16:55
July 12th 19 at 16:54
Thank you all, but here again the question arises: using float: left; on version page is to use adaptivity turns out that's the story: 0f70eea4957c49c59c2e8a170986f682.png
Therefore, it was used
.foto, .news {
 display: inline-block;
 }


Why in the first case (adaptability to) inline-block approaches, but in the second embodiment, only the float?

Find more questions by tags HTMLCSS