没有 CSS 的多个 div 中的响应式网格

Question

我正在尝试在计算机上制作大致如下所示的布局： 这在手机上：

我不能在样式属性中使用 CSS，因为它适用于不允许 CSS 的网站。

我尝试了几个不同的教程，但无法正常工作。感谢任何帮助，因为我是初学者，所以还有更清晰的代码提示。谢谢！

我的代码：

<div class="window" style="border: hidden; border-radius: 20px; box-shadow: 0 0 5px red; text-align: center; font-family: monospace; color: black; background-image: linear-gradient(#e6558b,red); padding: 10px; max-width: vw; max-height: 300px; margin: 10px; align-items: center;">
  
  <div class="title" style="background-color: white; border: hidden; border-radius: 20px; box-shadow: 0 0 5px white; padding: inherit; margin: inherit; align-items: inherit; text-align: inherit; max-height: 75px; font-size: 100%;">
    <p style="font-weight: bold;"><img src=""> title <img src=""></p>
    <p>subtitle</p>
  </div>
  
  <div class="miniholder" style="background-color: white; border: hidden; border-radius: 20px; box-shadow: 0 0 5px white; padding: inherit; display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 100px)); grid-gap: 1rem;">
      
    <div class="leftortop" style="border: 1px solid black; height:100px; width: 100%; margin: inherit;">
      <p><img src=""></p>
    </div>
    
    <div class="rightorbottom" style="border: 1px solid black; height:100px; width: 100%; margin: inherit; align-items: inherit;">
      <p style="width: 100%; height: 100%;">lorem ipsum</p>
    </div>
  </div>
</div>

我最初尝试使用弹性盒子，但我不知道它们是如何工作的…… 我发现 this 有点帮助，但它并不是我想要的布局，而且我也无法真正让它工作。