Как присвоить classList только к одному айди, а не ко всем?
При нажатии на жёлтую кнопку она смещается вниз, как и синяя, но мне необходимо, чтобы жёлтая оставалась на месте, а синяя смещалась. Никак не могу понять, почему classList присваивает .active ко всем айди (Если что-то не понятно или не хватает информации, то напишите, я добавлю)
function popi() {
document.getElementById("menu").classList.toggle('active');
}
.content_toggles {
position: absolute;
z-index: 2;
width: 100px;
height: 100px;
background-color: yellow;
border: none;
border-radius: 10px;
}
#pop .content_blocks {
position: absolute;
z-index: 1;
width: 100px;
height: 100px;
background-color: blue;
border: none;
border-radius: 10px;
left: 200px;
}
#menu.active {
margin-top: 103px;
}
<div id="menu">
<input type="button" class="content_toggles" onclick="popi()" \>
</div>
<div id="pop">
<input type="button" class="content_blocks"\>
</div>