Выравнивание текста под картинкой по ее ширине средствами css?

Question

[Александр]

Есть колонка с картинкой и описанием под ней.
Ширина колонки wrapper-basic должна подстраиваться под ширину картинки.
Ребят, возможно это сделать без $(...) ?

<div class="wrapper-basic"> 
   <div>Что любит мозг</div>
   <div>
      <div>
         <img src="images/img.png" alt="">
         <div>
            <div>
               <p>Ходите по квартире с закрытыми глазами</p>
               <p>Это позволяет задействовать <q>спящие</q> сенсорные участки мозга</p>
            </div>
         </div>
      </div>
      <article>
         <div>7 простых советов, помогающих сохранить молодость мозга Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vero, cupiditate, soluta, quia, aperiam nesciunt culpa asperiores aliquid numquam consequatur voluptatem expedita a quis eveniet debitis nulla ut inventore ipsam quos. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dicta, odio vel veritatis ducimus aliquam quasi ipsum itaque dolorum nesciunt alias quos velit sint ea a ullam numquam odit quam repudiandae!</div>
      </article>
   </div>
   <div>
      <div>
         <div><a href="#">Поделиться</a></div>
         <div><a href="#">В копилку</a></div>
         <a href="#"><img class="" src="images/arrow-diag.png" alt=""></a>
      </div>
   </div>
</div>

Answer 1

[Sergey Bopp]

Скорее всего поможет:

.wrapper-basic {
display: table; 
width: 1px;
}

Comments

[Александр]

Попробовал, картинка вместе с текстом уменьшилась. Но размер картинки заранее неизвестен. Как бы так сделать, чтобы без явного определения размеров блока текст автоматически подгонялся сам

[Антон]

Александр, Вот решение: https://jsfiddle.net/z9b6nL2t/1/