title: How can I make this layout responsive?
body: <p><a href="https://i.stack.imgur.com/XRRrS.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/XRRrS.png" alt="enter image description here" /></a></p>
  <pre><code>  &lt;div class=&quot;parentdiv&quot;&gt;
      &lt;div&gt;&lt;img src=&quot;img/noimage.png&quot;&gt;&lt;/div&gt;
      &lt;div class=&quot;bottom&quot;&gt;
        &lt;p class=&quot;text1&quot;&gt;Text1&lt;/p&gt;
        &lt;div class=&quot;btn_area&quot;&gt;
          &lt;a href=&quot;#&quot; class=&quot;text2&quot;&gt;Text2&lt;/a&gt;
          &lt;a href=&quot;#&quot; class=&quot;text3&quot;&gt;Text3&lt;/a&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  <p>I've barely managed to make this layout with bunch of floats, margins, tops and lefts but the layout breaks at practically any other screen ratios.</p>
  <p>I feel that I shouldn't be spamming float and margins when creating a layout. Are there any better options to build such layout that does not break catastrophically on ratio change?</p>
  <p>I've tried googling but what I've found was mostly making asingle div or image responsive which I've succeeded, but can't apply it to my layout.</p>