css - Div 不是从容器顶部开始的

Question

我有两个 div 水平居中并排的问题:其中一个从容器 div 的顶部开始，但另一个不是。我尝试修复它，但只找到了不太漂亮或不正确的解决方案。

是这样的:

<div id="missingSchoolProgram">
    <div id="missingSchool">
        <p>Votre école n'est pas dans la liste? Remplissez ce court formulaire afin de nous le signaler et qu'elle soit ajoutée plus rapidement!</p>
        <br /><br /><br />
        <form action="missingSchoolMail.php" method="POST">
            <p>Nom de l'école:</p>
            <input type="text" name="name" required="required" /><br /><br /><br />
            <input type="submit" name="submit" value="Signaler l'école manquante" /><br />
        </form>
    </div>
    <div id="missingProgram">
        <p>Votre programme n'est pas dans la liste? Remplissez ce court formulaire afin de nous le signaler et qu'il soit ajouté plus rapidement!</p>
        <br /><br /><br />
        <form action="missingProgramMail.php" method="POST">
            <p>Nom du programme:</p>
            <input type="text" name="name" required="required" /><br />
            <p>ID du programme (Ex.: 210.C1):</p>
            <input type="text" name="programID" maxlength="6" required="required" /><br /><br /><br />
            <input type="submit" name="submit" value="Signaler le programme manquant" /><br />
        </form>
    </div>
</div>

这些div的css如下...

#missingSchoolProgram
{
    width: 100%;
    text-align: center;
    border-top: 1px solid #e2e2e2;
    padding-top: 15px;
}

#missingSchoolProgram form
{
    background-color: #e7edf1;
    border: 1px solid #ccdce4;
    padding: 15px;
    text-align: center;
}

#missingSchool
{
    width: 250px;
    text-align: center;
    padding: 15px;
    border: 1px solid black;
    display: inline-block;
}

#missingProgram
{
    width: 250px;
    text-align: center;
    padding: 15px;
    border: 1px solid black;
    display: inline-block;
}

还有一个 jsfiddle，这样你们就可以看到问题... http://jsfiddle.net/7taEu/1/

在 GoDaddy 的服务器出现故障并且我的网站恢复到上次保存之前，这些东西运行良好...

Answer 1

将:vertical-align: top 添加到 #missingSchool。

http://jsfiddle.net/7taEu/3/