Here is the code snippet:
<select name="xyz" id="abc">
<option value="x">10/Page</option>
<option value="y">20/Page</option>
<option value="z">30/Page</option>
</select>
select {
display: flex;
outline: none;
cursor: pointer;
border: none;
}
option {
background: #f4f9fb;
border-radius: 4px;
border: none;
outline: none;
}
<select name="xyz" id="abc">
<option value="x">10/Page</option>
<option value="y">20/Page</option>
<option value="z">30/Page</option>
</select>
The attempt was made to change the styling of the select option using this code, however, no changes were observed.
Expected outcome should be: