I have a scrolling dropdown, and when someone opens the dropdown, I want the currently selected element to show in the center (if possible, aka it's low/high enough), instead of the browser default - in Firefox, the dropdown view shows the selected element at the end.
Unfortunately, you can't do that with your default select options.
This question is already answered here.
Anyway, you could build a custom select or could use plugin for custom select and then position the dropdown:
I think this can be possible you can center the selected ones but not all the options so the selected ones you can center it like
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
select {
width: 400px;
text-align-last: center;
}
</style>
</head>
<body>
<select name="state" class="ddList">
<option>Selected</option>
<option>A</option>
<option>B</option>
<option>C</option>
<option>D</option>
</select>
</body>
</html>use some js to re order your options, you could exchange the positions of the selected value with the middle done and you're done
u can get the children of the selecte
put the selected option in a var
get the middle one let target = option[Math.floor(childrend.length / 2)]
then a simple exchange of positions you could set this up as an eventlistener for the onchange or something