Question

我有一个简单的形式：出于某种原因，＆＃34;生成密码＆＃39;按钮没有在我的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>

Answer 1

为此，您必须减少移动按钮的字体大小和填充。 @media屏幕分辨率。对于移动设备，它不会将列更改为8.按钮溢出。这是因为按钮内部没有大量文本。您可以通过为按钮上方的div赋予overflow：hidden样式来验证它。

所以解决方法是对于移动分辨率，为按钮添加一个额外的类，并为您提供@media屏幕css并减小字体大小和按钮填充，以便在您遇到问题时获得小屏幕分辨率。

Boostrap按钮调整大小

1 个答案: