將div設置爲可見時停止內容移動？

Question

我有一個隱藏的div，當單擊單選按鈕時會顯示get，但是當我使div可見時，下面的段落被壓下來，有沒有什麼方法可以讓段落被按下，即使div被隱藏，這樣它不會移動？這裏是我的代碼

HTML

<div id="container">Hello</div> 
<p>Click the button below to view content</p> 
<input type="radio" onclick="displayDiv()"> 

CSS

#container { 
    display: none; 
    color: #fff; 
    font-size: 30px; 
} 

的Javascript

function displayDiv() { 
    document.getElementById("container").style.display = "block"; 
} 

Answer 1

更改屬性display通過visibility;它的目的是將div放置在頁面上，但如果將其賦值爲「hiden」，則將其隱藏。

見this

CSS：

#container { 
    visibility: hidden; 
} 

的JavaScript

function displayDiv() { 
    document.getElementById("container").style.visibility = "visible"; 
}