slider css style not entirely clear

I coded a slider like following to switch between two options:

1. <div class="ui-grid-a" data-role="fieldcontain">
2. <fieldset data-role="controlgroup">
3.     <div class="ui-block-a"><label for="check">check</label></div>
4.     <div class="ui-block-b">
5.       <select name="check" id="check" data-role="slider">
6.         <option value="N">No</option>
7.         <option value="Y">Yes</option>
8.     </select>
9.   </div>
10. </fieldset>
11. </div><!-- /grid-a -->

It works fine. But the style is not entirely satisfactory.
The corners are very clear on the side of the selected otion. But not on the other one:



Please, find attached a txt file containing the HTML statements to duplicate the rendering.
Is there a way of getting a better rendering?

• Topic Participants

• riou