时间戳

首页 > 解决方案 > 如何防止文本在选择框中被截断？

html - 如何防止文本在选择框中被截断？

问题描述

我有一个很长的选项，我需要与整个选择框一起正确显示。如果将宽度设置为 100%，然后选择第一个选项，文本将被截断。当宽度设置为自动时，没有滚动条，这是一个问题，因为我需要选择框适合另一个元素。

这段代码来自我一直用来检查更改的 w3schools 教程，因为它比使用 localhost 更快，因为网站已经启动并且这只是调试。

<!DOCTYPE html>
<html>

<body>

  <style>
    #selection {
      width: auto;
      overflow: scroll;
    }
    
    option {
      display: block;
    }
  </style>

  <select id="selection" multiple>
    <option value="volvo">If they are able to help ask them to wash themselves. You may give them step by step instructions such as, 'sit down' 'here is the cloth' 'wash your arm' etc. If they cannot, ask them to ‘help’ by holding the towel.</option>
    <option value="saab">Saab</option>
    <option value="opel">Opel</option>
    <option value="audi">Audi</option>
  </select>

</body>

</html>

标签： htmlcss

解决方案

推荐阅读