Comment 2 for bug 1432710

So here's what I was thinking:

1. Rename the !!T syntax to !!QA
2. Use this markdown.

### Question !!QA
This is the answer.

We would allow only one image per question, which would be optional, but should be in its own line after the answer and not embedded.

3. Generate this markup

a) Preferred:

<div class="row qa">
  <div class="eight-col">
    <h3 id="question">Question</h3>
      <p>This is the answer.</p>
  </div>
  <div class="four-col last-col">
    <img alt="Alt text" src="./images/image.gif" />
  </div>
</div>

If there is no image in the question, then the whole <div class="four-col last-col">[...]</div> div element would not be present.

b) Alternatively, if the above proves to be too complex, then this would also work (it would mean more manipulation in JS, but should be doable:

<div class="row qa">
  <div class="eight-col">
    <h3 id="question">Question</h3>
      <p>This is the answer. <img alt="Alt text" src="./images/image.gif" /></p>
  </div>
</div>

4. Use JavaScript to do any other markup manipulation (I can help with that)