如何在标签容器中调整div位置？

Question

我有一个只在我点击无线电输入时出现的div 。 但是在它显示之后它会弄乱我的其他单选按钮。 我该如何调整它的位置？

<!-- radio button code -->
<div id="chartDiv" style="display:none;" class="answer_list">Stĺpcový graf</div>
<input type="radio" name="grafy" value="graf5" onclick="showDiv()" />

（点击单选按钮后的div外观的JavaScript功能）

function showDiv() {
     document.getElementById('chartDiv').style.display = "block";
}

Answer 1

尝试将position:absolute on添加到div，这意味着它不会影响页面中任何其他元素的布局。

<div id="chartDiv" style="display:none;position:absolute;" class="answer_list">

如果这有帮助，您可以使用top和left css属性来定位div。

 <div id="chartDiv" style="display:none; position:absolute; top:20px; left:20px;" class="answer_list">

您可能还需要添加position:relative对于父元素，以使.answer_list div位置相对于该元素。

 <div style="position:relative">
    <!--other elements radio buttons and so on-->
    <div id="chartDiv" style="display:none; position:absolute; top:20px; left:20px;" class="answer_list">
</div>