如何在 div 内的图像左侧获取文本？答案

【问题标题】：How can I get text to the left of image inside a div?如何在 div 内的图像左侧获取文本？
【发布时间】：2021-07-30 17:46:37
【问题描述】：

我想在 div 中将图像放在文本的右侧。我看到的每个教程都提到了浮点数，虽然浮点数可以工作，但在 div 中它并不完全有效。如果我不把图片放在一个 div 中并浮动它，下面的 div 就会溢出它。

我希望它在一个 div 中，因为我希望文本和图像基本上都是一个项目。

我该如何排序？还是有更好的方法来做到这一点？代码如下：

HTML

<div class="intro">
    <div class="picture">
        <img class="col-s-3" src="images/my-picture2.jpg">
    </div>
    <div class="title">
        <p class="col-s-3">INSERT NAME<br>My Portfolio</p>
    </div>
</div>

“col-s-3”类本质上只是宽度 = 25%。

谢谢。

【问题讨论】：

标签： html css

【解决方案1】：

<div class="intro">
    <div class="title">
        <p class="col-s-3">INSERT NAME<br>My Portfolio</p>
    </div>
    <div class="picture">
        <img class="col-s-3" src="images/my-picture2.jpg">
    </div>
</div>

.intro {
  display: flex;
  flex-direction: row;
  align-items: center;
}

最好的尝试。

【讨论】：

【解决方案2】：

在.intro上添加这个CSS

.intro{display:flex;}

【讨论】：