Twitter bootstrap Boostrap按钮调整大小

我有一个简单的表单：出于某种原因，“生成密码”按钮在我的iphone上没有调整大小，占据了它的两倍大小（它占据了8列）。有人能帮忙吗

<form action="#" class="form-horizontal">

                    <fieldset>


                        <div class="form-group">


                        </div>  



                        <div class="form-group">
                                <label class="control-label col-xs-4 col-sm-4 col-md-4" for="passcodeID" > Amount: </label>

                                <div class="col-xs-4 col-sm-4 col-md-4">
                                <input type="text" class="form-control" id="passcodeID" autofocus/>
                                </div>

                        </div>  



                        <div class="form-group">


                                <div class="col-md-4 col-md-offset-4 col-xs-4 col-xs-offset-4 col-sm-4 col-sm-offset-4">
                                <button class="btn btn-primary" data-toggle="modal" data-target="#generatePasscode"> Generate Passcode </button>
                                </div>

                        </div>  


                    </fieldset>
                    </form>

数量：
生成密码

对于mobile，您必须减小按钮的字体大小和填充。分辨率为@media screen。对于mobile，它不会将列更改为8。按钮溢出。这是由于按钮内没有大量文本。您可以通过为button上方的div指定溢出：隐藏样式来验证

所以解决办法是 对于移动分辨率，为按钮添加一个额外的类，并提供@media screen css，并减少字体大小和按钮的填充，以便在小屏幕分辨率下解决您面临的问题。