我想使用bootstrap css:
我写了一个jsfiddle来做我的测试:
http://jsfiddle.net/xr4uofje/
<div class="container"> <div class="col-lg-6"> <div class="input-group"> <input class="input-group-addon" size="8" type="text"> <span class="input-group-btn"> <select class="form-control"></select> <button type="button" class="btn btn-default">Get</button> </span> </div> </div> </div>
解决方法
你可以把这种类型的元素
HTML
<div class="container"> <div class="col-lg-6"> <div class="input-group my-group"> <input type="text" class="form-control" name="snpid" placeholder="Test"/> <select id="lunch" class="selectpicker form-control" data-live-search="true" title="Please select a lunch ..."> <option>Hot Dog,Fries and a Soda</option> <option>Burger,Shake and a Smile</option> <option>Sugar,Spice and all things nice</option> <option>Baby Back Ribs</option> <option>A really really long option made to illustrate an issue with the live search in an inline form</option> </select> <span class="input-group-btn"> <button class="btn btn-default my-group-button" type="submit">GO!</button> </span> </div> </div> <div>
CSS
.my-group .form-control{ width:50%; }
JQUERY
if ( $.browser.webkit ) { $(".my-group-button").css("height","+=1px"); }