如何在移动视图（博客网站）上放置此文本？

Question

所以我对网络开发（以及任何需要代码的东西）都是全新的，我在我的博客网站上工作时遇到过这个问题。我导入了主题模板，目前正在尝试学习使用它。

this is how it looks on desktop (this is fine)

And this is how it looks like on something like an IphoneX (I suppose I'd want the text to be placed below instead

我不太确定我应该在此处复制代码的哪一部分，所以我只输入 url:

psycoachalpha.blogspot.com

如果有人可以帮我解决这个问题，或者如果您需要更多信息来解决这个问题，请告诉我。谢谢！

Answer 1

您可以将 flexbox 方法与 flex-wrap:wrap 结合使用，这样溢出的项目就会换行

Answer 2

如果您使用的是 bootstrap，则可以使用网格系统，这样您就可以在桌面上并排显示博客，并在移动设备上将文本置于图像下方

<div className="row">
   <div className="col-sm-4 col-lg-4">
        <div className="skill-item">
            <img className="sticky" src="https://via.placeholder.com/400x790/444444.jpg" title="single-img-five" alt="single-img-five" />
        </div>
   </div>
   <div className="col-sm-8 col-lg-8">
       <div className="skill-item">
          <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book</p>
        </div>
   </div>
 </div>

如何在移动视图（博客网站）上放置此文本？

How do I place this text below, on mobile view (blogger website)?

html

css

templates

blogger

responsive-images