Font size of select options element text in html5

Question

Kindly assist on how to increase font size of text in option in select element in html. I want to increase the size of select options "Not Satisfied, Satisfied and Very Satisfied" because it looks small in android browsers.

<form action="" method="GET">
    <select name="selection" style="height:80px; width:300px; vertical-align: middle;">
        <option value="not satisfied">Not Satisfied</option>
        <option value="satisfied">Satisfied</option>
        <option value="very satified">Very Satisfied</option>
    </select>
</form>

Does this answer your question? [How do I change the font-size of an — corashina, Sep 17 '20 at 07:50

Mehedi Hasan Siam · Accepted Answer · 2020-09-17T06:16:14.490

You can increase by default selected option's font size by adding font-size in select. For increasing the select option's font size, keep options in optgroup and in css make a class called optgroup and fixed a font size.

optgroup { font-size:40px; }

<form action="" method="GET">
    <select name="selection" style="height:80px; width:300px; vertical-align: middle;font-size: 40px;">
      <optgroup>
        <option value="not satisfied">Not Satisfied</option>
        <option value="satisfied">Satisfied</option>
        <option value="very satified">Very Satisfied</option>
       </optgroup>
    </select>
</form>

score 0 · Answer 2 · answered Sep 17 '20 at 07:55

you can simply add css font-size property to select element this will increase the size of text.

<form action="" method="GET">
    <select name="selection" style="height:80px; width:300px; vertical-align: middle;font-size:40px;">
        <option value="not satisfied">Not Satisfied</option>
        <option value="satisfied">Satisfied</option>
        <option value="very satified">Very Satisfied</option>
    </select>
</form>

Font size of select options element text in html5

2 Answers2