Please help me figure it out, I just can’t put the pop-up block to the forefront, which I haven’t tried already, nothing helps, I’ve attached a photo, what’s the window behind the blocks, I need to bring it to the front

<div class="s2-item-wrap spoiler-wrap disabled"> <a href="#q" class="s2-item spoiler-head"> <span class="img-wrap"> <img src="img/icons/section_2/1.png" alt="Alt"> </span> <span class="s2-item-text">IT, компьютеры, связь</span> <div class="spoiler-body"> В данном разделе собрана полезная информация о компьютерной сфере. Во- первых, здесь представлены крупные тендеры из области IT по разработке и управлению информационными системами. Во-вторых, в этом разделе найдётся целый ряд тендеров на поставку готового оборудования – компьютеров, оргтехники, комплектующих. В-третьих, здесь есть проекты по ремонту и обслуживанию современной вычислительной и офисной техники. </div> </a> </div> 

js --->

  jQuery(document).ready(function(){ jQuery('.spoiler-head').click(function(){ $(this).parents('.spoiler-wrap').toggleClass("active").find('.spoiler- body').slideToggle(); }) }) 

CSS ---->

 .spoiler-wrap margin: 0 0 8px .spoiler-head cursor: pointer padding: 5px .spoiler-body margin-left: -130% padding: 10px background-color: #333 color: #fff border: 1px solid #F39F18 width: 500px .spoiler-wrap &.disabled .spoiler-body display: none 

enter image description here

  • one
  • I have not tried anything yet, it does not help - Alexey Sokolov
  • create a working example - Igor
  • playcode.io/ ... Here, only sass does not read - Alexey Sokolov
  • create a working example demonstrating the problem you are trying to solve - Igor

1 answer 1

Add styles

 .s2-item-wrap.active { position: relative; z-index: 1; }