Question

我正在使用。警告,这是我成功的警示信息:

<div class="alert alert-success" id="UploadSuccess">
    <a class="close" data-dismiss="alert">×</a>
    <strong>Congrats!</strong> You have successfully did it!.
</div>

结果是:

由于你可以发现文本的校正位于<代码>和div>上。因此,二者如何将其与中间方保持一致?

我曾尝试使用<条码> dding/代码>和<条码> vert-align:middle<>/code>,但两者兼有(最后结果相同)。

我需要做些什么来改变案文的纵向统一?

Answer 1

将div中的line-hala与div的h 8,相同,例如:

#UploadSuccess { height: 20px; line-height: 20px; }

只有当你有一行案文时,才会这样做。

Answer 2

采用垂直中心案文是一个共同的问题。通常,这种 would子在普通箱子上工作,但你可以迫使其与纵向调和:

vertical-align: middle;
display: table-cell;

然而,这不会在E7和E7下奏效。

如果你确信,你想要显示的文字,你就可以使用直线手法来发挥这种作用:

height: 40px;
line-height: 40px; /* same as height */

This way works cross browser and has support up to IE5.5 I believe. If this is not an option I m afraid you re out of luck (it can t be done).

As a side note that error message suffers from bad grammar, it should be "Congratulations! You have successfully done it.".

Answer 3

Make it easier ;) ! Try to use alert-block ! That works fine with latest Bootstrap version !

<div class="alert alert-block alert-success" id="UploadSuccess">
    <a class="close" data-dismiss="alert">×</a>
    <strong>Congrats!</strong> You have successfully did it!.
</div>

友情链接