css - 为数据列表中的选项提供固定长度

Question

我有这个 HTML 代码：

<style type="text/css">
.select {
    white-space:pre-wrap;
    background-color:#FF9;  
        width: 500px;
}
</style>
<input type="text" list="browsers" class="select"/>
<datalist  id=browsers >
    <?php while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)) {;?>
    <option>
        <?php echo $row_Recordset1['RBC']; }?>
    </option>
</datalist>

我有一些超过 500px 的数据，因此当我单击文本框时，列表宽度大于文本框宽度（500px）

如何修复列表宽度？

Answer 1

您可以做到这一点的唯一方法是将 CSS 与 white-space 属性和 no-wrap 一起使用。
http://www.w3schools.com/cssref/pr_text_white-space.asp

或者您可以在输入周围使用 div 来强制大小，让输入成为它需要的大小，并使用带有 overflow-x 的 div 来控制大小并将其强制为 500px 宽度。