Search code examples
jquerycssjqtransform

change font-size of jQtransform dropdowns

I seem to be completely unable to change the font-size of the jQtransform dropdowns. I am using the default h5bp css file, although that dosn`t seem to be causing the trouble (I highly doubt it). My form looks something like this

                   <form id="qstart" class="cssform" action="">

<select name="select">    
    <option value="opt1" >Anyone can join, at anytime</option>

    <option value="opt2">Send invitations to people I want to join</option>
    <option value="opt3">Allow people to apply to the group at anytime, but I'll approve who gets in</option>
</select>
    <br/>
<div style="text-align:center;display:block;">
    <br/>
<input type="submit" value="LET'S GO! WOOO!" />
</div>

</form>

When I try

      .cssform select{
            font-size:20px !important;
    }
.cssform select option{
            font-size:20px !important;
    }

all that changes is that the width of the select box. Any advice?

Solution

  • jQtransform hides your original <select> element and replaces it with it's own HTML to reproduce it's behavior.

    You need to look into what HTML code is added to the DOM after you initialize jQtransform and style those elements from you CSS code.