GIF微調器保持左對齊，如何通過Java居中對齊

Question

我有以下HTML中的DIV：

<div id="progress" class="progress">
    <img src="Content/themes/base/images/progress.gif" />
    <br />
    <span>LOADING... </span>
</div>

CSS類定義為：

.progress
{
text-align: center;
}

在頁面加載中，進度微調器將加載到屏幕中心，但是當我隱藏然后顯示此微調器時，它始終保持對齊。

以下是停止微調器的代碼：

document.getElementById("progress").style.display = "none";

並再次顯示它（此處變為與屏幕左對齊）：

document.getElementById("progress").style.display = "inline";

我想念什么？

Answer 1

我解決了 我修改了CSS類，如下所示：

.progress
{
text-align: center;
display: none;
}

並使用了JQuery的show / hide方法：

$(".progress").show();
$(".progress").hide();

工作完美！

Answer 2

text-align僅適用於塊容器（默認情況下為div）。

使用display: block不display: inline

…style.display = "block";

Answer 3

最好隱藏並顯示微調器，因為您不想更改任何CSS，因為使樣式內聯使其左對齊，您也可以使用

document.getElementById("progress").style.display="box"; 

並且不會應用左對齊。