html - 如何在 <div> 中将 <p> 放在 <img> 旁边？

Question

我需要在 html 页面中的图像左侧放置一个段落。现在，文本在图像旁边，但段落本身在图像后面延伸到容器的左侧。我希望它们只是彼此并排，内联，段落中的文本像普通文本一样环绕。

<div class="content-box">
            <h1>Welcome to Genesis of Robotics!</h1>
            <p>Unrelated text </p>
                <div id="holder">
                    <img id="problem-image" src="css/images/problem_image.jpg" width="500px" height="300px">
                    <p class="p">The Problem Text</p>
                </div>
            <img src="css/images/define.png" width="200px" height="200px">
            <img src="css/images/brainstorm.png" width="200px" height="200px">
        </div>

CSS:

#drawing-image {border-radius: 15px; }
    .content-box h1{color:#fff; text-align: center; margin: auto; width: 630px;    background: url(css/images/paper.png); padding: 12px; border-radius: 15px;}
    .content-box p{padding-top: 40px; padding-bottom: 40px;}
    #holder {height: 0px; width: auto; height: auto; }
    #holder p { height: auto; width: 100px; }
    #holder img { margin: 15px; }

Answer 1

这个怎么样？ #holder img { float :左；显示:内联； padding-right:10px;} #holder p {display:inline;}