Reputation: 804
I want to reduce the size of the font in my radio buttons as they are taking up too much space on mobile app. I tried to do inline styling and it did not work. I'm using jquery mobile 1.3 and when I was using jquery mobile 1.2, I had no problem changing font-size. Any help would be appreciated.
<div data-type="horizontal">
<fieldset class="ui-grid-a">
<legend>I am a </legend>
<div class="ui-block-a">
<input type="radio" name="rad-User-Type-1" id="rad-User-Type-1" value="driver" checked="checked" data-theme="c" />
<label for="rad-User-Type-1"style="font-size:12px" >Driver</label>
</div>
<div class="ui-block-b">
<input type="radio" name="rad-User-Type-1" id="rad-User-Type-2" value="passenger" data-theme="c"/>
<label for="rad-User-Type-2" style="font-size:12px">Passenger</label>
</div>
</fieldset>
</div>
Upvotes: 1
Views: 3873
Reputation: 1
.ui-radio-on .ui-btn-text, .ui-radio-off .ui-btn-text{
font-size:13px;
}
Upvotes: 0
Reputation: 349
You can inspect styles with Firebug (http://getfirebug.com/) and see/edit styles in real time to find the solution.
Upvotes: 1
Reputation: 167192
Try changing:
<label for="rad-User-Type-1"style="font-size:12px" >Driver</label>
To:
<label for="rad-User-Type-1"style="font-size:12px !important" >Driver</label>
And let us know?
Upvotes: 0