用CSS/HTML格式化考试

我想在线格式化考试文本。经过上下搜索，这是我能想到的唯一解决方案：

<table>
<tr><td colspan="3">Question 1</td><td>[24]</td></tr>
<tr><td>1.1</td><td colspan="2">Solve for $x$</td></tr>
<tr><td></td><td>1.1.1</td><td>$(3x+7)(x^2+2)=0$</td><td>(3)</td></tr>
<tr><td></td><td>1.1.2</td><td>$\sqrt{2-x} - x = 4$</td><td>(5)</td></tr>
<tr><td>1.2</td><td colspan="2">The equations of two parabolas are $y = x^2 + 
    x + c$ and $y = 1 - cx - x^2$, where $c$ is a real number.</td></tr>
<tr><td></td><td>1.2.1</td><td>Prove that these parabolas must intersect 
    for all real values of $c$.</td><td>(6)</td></tr>
</table>

问题1[24]
1.1美元的解决方案$
1.1.1美元（3x+7）（x^2+2）=0美元（3）
1.1.2$\sqrt{2-x}-x=4$（5）
1.2两条抛物线的方程式为$y=x^2+
x+c$和$y=1-cx-x^2$，其中$c$是实数。
1.2.1批准这些抛物线必须相交
所有实际价值为$c$（6）

试着让每个问题都排成一行。我曾经研究过使用HTML列表，但在插入图形等时，它们会出现问题。有什么我遗漏的吗？有没有更快的方法把它打印出来？我的问题仅仅在于格式，在寻找答案的同时，我已经计算出CSS中的计数器

---

非常感谢，来自绝望的老师和noobie

如果你的问题是垂直对齐，在顶部，问题的编号和分数，最简单的答案是添加一个css样式

垂直对齐：顶部

因此，您的css应该类似于：

td {
    vertical-align:top;
}

看到这个了吗

对于更高级的版本，您不应该使用表来格式化输出。在这种情况下，您有一个顺序列表，因此，表被转换为
ol
和
li
元素，分数被放入
div
元素中：

<ol>
    <li class="mainquestion">Question 1
        <div class="score">[24]</div>
    </li>
    <ol>
        <li>Solve for $x$</li>
        <ol>
            <li>$(3x+7)(x^2+2)=0$
                <div class="score">(3)</div>
            </li>
            <li>$\sqrt{2-x} - x = 4$
                <div class="score">(5)</div>
            </li>
        </ol>
    </ol>
</ol>

请参见中的示例

OL { counter-reset: item }
LI { display: block }
LI:before { content: counters(item, ".")" "; counter-increment: item }
ol:first-child { padding: 0; }
li.mainquestion { list-style: none; }
li.mainquestion+ol { padding: 0; }
li.mainquestion:before { content: ""; counter-increment: item }
div.score { float: right; }