<span class="remark" style="display: inline">
      <span style="display: flex; flex-direction: column; flex-wrap: wrap">
        <div class="topic" style="font-size: 12px; border-width: 1px; border-style: solid; border-color: green">This is the secondary row.</div>
        <div class="text" style="font-size: 18px; border-width: 1px; border-style: solid; border-color: red;">This is the primary row. Ideally, once either row reaches the end of the container, the stack will wrap to the next line, reserving space for both rows, creating effectively two sets of rows of alternating Christmas colors instead of one line of green and three lines of red, ho ho ho!</div>
      </span>
    </span>