Menu
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.
363
If the vertical scroll is more than the element's position, the position property is set to 'fixed', and the 'top' property is given a value of '0px'. Otherwise, the position is set to 'relative', and the 'top' property is reset using the 'initial' value.
By using an href attribute inside an anchor tag you can scroll the page to a specific element using a # in front of the elements id name.
The scroll-snap-align property specifies the box's snap position as an alignment of its snap area (as the alignment subject) within its snap container's snapport (as the alignment container). The two values specify the snapping alignment in the block axis and inline axis, respectively.
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:
https://select2.org/
http://gregfranko.com/jquery.selectBoxIt.js/
170
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>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
