Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

Also, it uses this instead of <select>:

            <div class="menu" tabindex="-1">
              <div class="item" data-value="ad"><i class="ad flag"></i>Andorra</div>
              <div class="item" data-value="ae"><i class="ae flag"></i>United Arab Emirates</div>
              <div class="item" data-value="af"><i class="af flag"></i>Afghanistan</div>


`<select>`s aren't styleable so you have to do a select proxy.


They are, to some extent at least, depending on what browsers you need to support. You have to set *-appearance: none and build the styles back up.


Thanks! More info for others: http://stackoverflow.com/questions/1895476/how-to-style-a-se...


Look at the second example:

https://semantic-ui.com/modules/dropdown.html#selection


Unfortunately there are some severe limitations of using native select, in particular in relation to list item (i.e. option element)

- Can't have anything but plain text: (e.g. no images, bold text etc)

- Can't have a line-break, or somehow wrap text into a 2nd line if entry is too long




Consider applying for YC's Winter 2026 batch! Applications are open till Nov 10

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: