Html 如何在包含图像的两个div元素之间显示文本段落？ 我很难把页面中间的段落放在我的其他div内容之间。

我有两个div元素，一个在左边，另一个在右边，我想把段落放在这两个div元素之间，但我想不出来

现在段落位于页面的中心，但是它们显示在div元素下面，而不是它们之间

我试图将这些段落的位置设置为绝对位置，但随后文本将相互重叠，因此我尝试在段落中添加边距，但这并没有影响到它，因此我回到了它的状态

p{
    color: white;
    float: center;
    text-align: center;
    display: inline-block;
    margin: 0 0 0 32vw;
    padding: 0;
    width: 15em;
    border: 1px solid white; 
    font-family: Verdana, Sans-Serif;
    font-size: 2.5em;
    line-height: 2em;
    overflow: hidden;
}

.TallPhotos{
    display: inline-block;
    float: right;
    max-width: 21vw;
    margin: 0;
    padding: 0;
    border: 1px solid green;
    overflow: hidden;
}

---

我包括了一个div元素，以防万一。

请使用display:flex

这里有一些代码，我已经累了，希望这会对你有所帮助

<div class="container">
   <div class="content">
       <div class="image1">
          <img src="https://tinyjpg.com/images/social/website.jpg" alt="">
       </div>
         <div class="paragraph">
              <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque, a ad sequi. Voluptas enim veniam modi. Sapiente amet, quas quasi aliquid, velit perferendis optio voluptate earum adipisci eius itaque totam.</p>
          </div>
          <div class="image2">
              <img src="https://tinyjpg.com/images/social/website.jpg" alt="">
          </div>
    </div>
</div>

---

您可以将代码重新构造为使用三个div，而不是两个div和一个段落。您的中间div可以包含以下段落：

.parent{
显示器：flex；
}
段落{
填充：6px 12px；
}

这是一段

我的想法是添加一个主div。按顺序将所有3个元素放入其中，img（div），段落，img（div）。然后在CSS中，在主div上使用：

显示柔性； 证明内容：之间的空间

这应该得到正确的设置。从那里玩元素的宽度，得到你喜欢的方式

---

干杯。

简单的方法就是使用flexbox

.flex父项{display:flex；}

同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）。同侧叶盲蝽（Lorem ipsum dolor sat amut）

您的html结构是什么？好的，谢谢您的帮助和视频，非常感谢并感谢所有提供帮助的人！不客气。请选择一个正确答案（单击答案左上角的复选标记）。梅勒乌鸦

.container {
        width: 80%;
        margin: 0 auto;
    }
    .content
    {
        display: flex;
        align-items: center;
        justify-content: space-between;
        align-content: center;
    }
    .content .image1,
    .content .image2,
    .content .paragraph
    {
        width: 32%;
    }
    img
    {
        width: 100%;
    }