In my default selection it shows the first element in the list "Select a genre". That is how I want to see it but I dont want it ("select a genre") to be select able and seen in the list
<div class="wrapper">
<select id="first-disabled" class="selectpicker" data-hide-disabled="true" data-live-search="true">
<optgroup >
<option>Select a Genre</option>
</optgroup>
<optgroup label="Rock">
<option>Punk Rock</option>
<option>Hard Rock</option>
</optgroup>
<optgroup label="Pop">
<option>Turkish Pop</option>
<option>English Pop</option>
</optgroup>
</select>
</div>
.wrapper {
position: relative;
top: 326px;
left: -42px;
height: 100%;
width: 100%;
z-index: 10;
text-align: center;
}
As it can be seen in the code my first option seems to be the default selection. As you can see my div wrapper css behind my selection bar code. I use custom bootstrap bar. As it can be seen in the image it can be seen and selectable in the option list.
here is the image: