Как сделать, чтобы селект всегда выпадал только вниз?

сейчас может как вниз, так и вверх

использую плагин select2

$('.js-example-basic-single').select2({
  placeholder: 'Select an option',
});
select {
  display: block;
  width: 100%;
}


body {
  padding: 0 20px;
}

.btn.active {
  
  color: red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet"/>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum blanditiis sapiente voluptas cumque architecto consequuntur ducimus reprehenderit modi non nihil repudiandae a, similique unde doloremque, voluptatem inventore praesentium! Voluptate, eligendi.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum blanditiis sapiente voluptas cumque architecto consequuntur ducimus reprehenderit modi non nihil repudiandae a, similique unde doloremque, voluptatem inventore praesentium! Voluptate, eligendi.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum blanditiis sapiente voluptas cumque architecto consequuntur ducimus reprehenderit modi non nihil repudiandae a, similique unde doloremque, voluptatem inventore praesentium! Voluptate, eligendi.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum blanditiis sapiente voluptas cumque architecto consequuntur ducimus reprehenderit modi non nihil repudiandae a, similique unde doloremque, voluptatem inventore praesentium! Voluptate, eligendi.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum blanditiis sapiente voluptas cumque architecto consequuntur ducimus reprehenderit modi non nihil repudiandae a, similique unde doloremque, voluptatem inventore praesentium! Voluptate, eligendi.</p>

<select class="js-example-basic-single" name="state">
  <option></option>
  <option value="AL">пункт 1</option>
  <option value="WY">Wyoming</option>
  <option value="AL">Alabama</option>
  <option value="WY">Wyoming</option>
  <option value="AL">Alabama</option>
  <option value="WY">Wyoming</option>
  <option value="AL">Alabama</option>
  <option value="WY">Wyoming</option>
</select>
<div class="list"></div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum blanditiis sapiente voluptas cumque architecto consequuntur ducimus reprehenderit modi non nihil repudiandae a, similique unde doloremque, voluptatem inventore praesentium! Voluptate, eligendi.</p>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum blanditiis sapiente voluptas cumque architecto consequuntur ducimus reprehenderit modi non nihil repudiandae a, similique unde doloremque, voluptatem inventore praesentium! Voluptate, eligendi.</p>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum blanditiis sapiente voluptas cumque architecto consequuntur ducimus reprehenderit modi non nihil repudiandae a, similique unde doloremque, voluptatem inventore praesentium! Voluptate, eligendi.</p>

<button class="btn">button</button>

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>


Ответы (0 шт):