Question

我在select选项中有一个长度字。因此，使用twitter bootstrap选择选项列表超过了iphone宽度。我该如何解决这个问题？

这是我的正常编码：

<select id="country">
<option>South georgia and the south sandwich islands</option>
<option>United states</option>
</select>

Answer 1

只需限制Div for iPhone屏幕的宽度即可。例如，假设iPhone屏幕的宽度为350px（我现在还不记得了），所以现在你可以将屏幕尺寸限制为340px，最高可达350px（iPhone）。

这将保持其响应能力并帮助您。只需遵循Code Logicowow：

@media-screen and (max-width=350px)
 {
 max-width: 340px;
 text-align : center;
 }
}

希望这有帮助。

Answer 2

转到第7行（可能）的“Bootstrap.min.css”，更改以下内容：这也将限制下拉列表的宽度。

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width : 190px;  /*CHANGE THIS TO - "max-width : 150px;" or whatever width you want */
    padding: 5px 0;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
    background-clip: padding-box;
    }

使用twitter bootstrap选择选项列表超过iphone宽度

2 个答案: