Как поставить теги под каждый отдельный тег img

Question

Может кто-нибудь показать мне, как разместить текст под каждым отдельным изображением, а также изображения должны быть в одной строке с работающей, я понимаю, что отображение различий для тега "a" является блоком, а для тега "img" - встроенным. Это мой код:

HTML

 <div class="other-content">
        <div class="search">
            <h1>We Offer best experience in the world</h1>
            <img src="../Images/beach.jpg" alt="beach" width="200px" height="150px">
            <p>sadasdasd</p>
            <img src="../Images/desert.jpg" alt="desert" width="200px" height="150px">
            <p>sadasdasd</p>
            <img src="../Images/evergreen.jpg" alt="maoutin" width="200px" height="150px">
            <p>sadasdasd</p>
            <img src="../Images/snow-pathway.jpg" alt="snow-pathway" width="200px" height="150px">

        </div>
    </div>       

CSS

.other-content .search {
    background: #ffffff;
    height: 300px;
    text-align: center;
}

.other-content .search p{
    display: inline;
}

Answer 1

Просто поместите изображение с текстом в отдельные элементы div и уменьшите ширину элемента div, пока текст не окажется ниже рисунка. И с этими div'ами присвойте display:inline-block;