CSS :after content below a select element causes click not to work

The simplest CSS solution would be to add pointer-events: none to the pseudo element. In doing so, you can click through the element because mouse events are removed.

Updated Example

.select:after {
    position:absolute;
    bottom:.15em;
    top:.15em;
    right:.5rem;
    content:'\2193';
    pointer-events: none;
}

^{(Just take browser support for the property into consideration.)}