Having an issue with a slider in uikit. When the slide changes, the visible elements also change their class to uk-active. I'm trying to select the central element from the active ones but css nth-child doesn't work. Any suggestions on how to do this correctly? Maybe setting a specific class. Here's the code snippet:
<div id="services-slider" uk-slider>
<ul class="uk-slider-items uk-child-width-1-1 uk-child-width-1-3@s uk-child-width-1-3@m">
<li>
<div class="services-box">
<strong>Title1</strong>
<p>Some text.</p>
</div>
</li>
<li>
<div class="services-box">
<strong>Title2</strong>
<p>Some text.</p>
</div>
</li>
<li>
<div class="services-box">
<strong>Title3</strong>
<p>Some text.</p>
</div>
</li>
<li>
<div class="services-box">
<strong>Title4</strong>
<p>Some text.</p>
</div>
</li>
<li>
<div class="services-box">
<strong>Title5</strong>
<p>Some text.</p>
</div>
</li>
</ul>
<div class="navigate">
<button uk-slider-item="0">01</button>
<button uk-slider-item="1">02</button>
<button uk-slider-item="2">03</button>
<button uk-slider-item="3">04</button>
<button uk-slider-item="4">05</button>
</div>
</div>