I’m using q-select to display the months and the font size is quite small so I want to make the options larger. I tried changing the font-size in css but it didn’t work.
My select atm
<q-select ref="month" input-style="zoom: 1.2; text-align: right;" rounded outlined clearable class="text-h4" v-model="oMonth" :options="oMonths" />
What the output looks like months selection
Advertisement
Answer
The <q-select>
attributes you need to affect the appearance of the popup menu and its option items are popup-content-class
and/or popup-content-style
. (You can also use the option
slot if you need more control over the content of each item.)
Something along these lines would work, for h6-sized text:
<q-select ref="month" input-style="zoom: 1.2; text-align: right;" rounded outlined clearable class="text-h4" popup-content-class="text-h6" v-model="oMonth" :options="oMonths" />