Question

我只使用HTML和CSS以及Bootstrap。我在选项中有很长的值，但我希望它们会显示在s col-md-6选择框中。但选择框正在以适当的方式进行，但价值正在离开屏幕。对于台式机和平板电脑也是如此。

我搜索了很多但没有得到适当的解决方案。

这是我的代码：

<html>
<head>
  <style>
    select {
      width: 400px; 
      font-size: xx-large; 
    }

    option {
      font-size: xx-large;
      padding: .5em; 
    }
  </style>

  <title></title>
</head>

<body>
  <form>
<div class="row">
<div class="col-md-6">
    <label for="id_foo">Foo:</label> 
    <select name="foo" id="id_foo" style="width:100%">
       <option>1dfdsfsdfdsfdfdsfdfdsfddgfgghghghghjhgjhgghkhjkhgkjkeretryw4562456fhgfh</option>
       <option>2</option>
       <option>3</option>
       <option>4</option>
       <option>5</option>
       <option>6</option>
       <option>7</option>
       <option>8</option>
       <option>9</option>
    </select><br />
</div>
</div>

    <input type="submit" value="Submit" name="submit" id="submit" />
  </form>
</body>
</html>

Answer 1

我找到了答案。

其Bootstrap Col-md-x类问题。从我的起始容器，我错过了一些类值。现在我按照我想要的方式重新安排它们。谢谢Rajesh。

选择下拉列表将关闭长选项值

1 个答案: