JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
  <div class="block">      
      <img src="/wp-content/uploads/2018/02/1-2.png" />		
  </div>
  <div class="wrapp">
						<p>
              <a href="/testy" rel="nofollow">Хорошо ли вы знаете свои уши?</a>
            </p>
  </div>		                     
	<div class="bl"></div>
</div>

CSS

.wrapper {
  background-color: #f8f8f8; 
  margin: 10px 0 10px 0; 
  text-align:left;
  border: 3px solid blue;
}

.block {
   float: left; 
   padding: 10px;
    border: 1px solid red;
}

/*wrapp-ваш проблемный блок. Как вам описали выше: ваш блок "прибило" к правому краю при помощи float: right. А text-align:left уже работает. Я,просто, для наглядности вам это подтверждаю примером с границами и закоментированным float. Так же обратите внимание что этот блок выпадает за границы родительск ого блока, если снять коментарии с св-ва float.  */

.wrapp {
  /*float: right;*/
  padding: 10px 20px 10px 10px; 
  text-align:left;
  border: 2px solid orange;  
}
  
.bl { clear: left;}