I have the following select, and I want to change its size, both the size of the select in general and, more importantly, its text. The text it contains are flags so they are shown as an emoji but as it is inside a text type it should be able to be changed with font-size, but the size remains the same.
<Select class="language" autoAdjustWidth="false" id="language" change="onChange">
<core:ListItem class="icon" key="uk" text="🇬🇧"/>
<core:ListItem class="icon" key="es" text="🇪🇸"/>
</Select>
This is all I've tried in the css but I don't know which way to go.
.language {
margin-right: 20px !important;
font-size: 200rem !important;
border-style: hidden !important;
/* width: 0.1em !important;*/
/* width: 65px !important;
height: 65px;*/
}
.language .sapMBtnText{
font-size: 20rem !important;
}
.icon .sapMBtnText{
font-size: 50rem !important;
width: 60px !important;
}
.icon{
font-size: 150px !important;
}