容器内联块再次

Question

Look at this

我想制作一个有两个子容器的主容器-左右（每个为屏幕宽度的50％。）>

左必须包含一张照片。右边的必须包含文本（h2和p正下方）。文本应该在图像的中间。

我需要它来描述商店中的产品。

我正在尝试这个

div { border: 1px solid #CCC; }

<div style="display: inline">a</div>
<div style="display: inline">b</div>
<div style="display: inline">c</div>
但是在这种情况下，我无法在同一格中键入h2和p。

谢谢。

看这个，我想制作一个有2个子容器的主容器-左右（每个为屏幕宽度的50％）。左边必须包含一张照片。右边必须包含文本（h2和p ...

Answer 1

如果您不介意使用flexbox。

Answer 2

根据我的拙见，网格是您要使用它的正确工具。我认为它比flexbox更新，并且需要一点时间来使用，但是如果您花时间学习它，那么整个Web开发的世界将会改变（不需要花8到12个小时的时间掌握概念）。任何人，下面是我要怎么做。要了解有关CSS GRID的更多信息，请检出