SO-72677128

by David Thomas

HTML

<section class="infobox">
  <main class="popup">
    <aside class="thumb"><img class="mini" src="image.jpg" /></aside>
    <article class="info">
    <h1>Heading Text</h1>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Quis ipsum suspendisse ultrices gravida. Risus commodo viverra maecenas accumsan lacus vel facilisis.</p>
    </article>
    <footer class="infofoot">
      <a target="windowid" href="http://example.com">A single line of linked text.</a>
    </footer>
  </main>
</section>

CSS

a {
  text-decoration: none;
}

img.mini {
  width: 20vw;
  height: 20vh;
  float: left;
  padding: 20px 10px 10px 10px;
}

.infobox {
  display: flex;
  flex-direction: column;
}

.popup {
  width: 50vw;
  flex-direction: row;
}

.infofoot {
  background-color: azure;
}