在HTML中选择下拉选项中设置下拉元素的宽度 [英] Set width of dropdown element in HTML select dropdown options

问题描述

我正在使用一个网站，涉及使用PHP脚本自动填充一个选择框。这一切都工作正常，除了问题是，我用来填充文本框有非常长的标题（他们是杂志文章和演示文稿标题）。下拉框延伸到最长元素的宽度，其从屏幕的边缘延伸，因此使得滚动条不可能到达。我尝试了各种方法试图手动设置下拉框使用CSS到一个特定的宽度，但到目前为止没有效果。最好的我已经完成它设置选择框到一定的宽度，但下拉菜单本身是多得多，更宽。

任何提示，这将非常感谢。

编辑：

事实证明，以下CSS行的主要浏览器（Google Chrome除外）（这是我在测试网页）。如果已知Chrome的解决方案，那么最好了解一下。

  select，option {width：__; } 
  

解决方案

实际项目本身与选项选择器：

  ：__; } 
  

这样，你不仅限制下拉列表，而且还限制其所有元素。 / p>

I am working on a website that involves automatically populating a select box using a PHP script. This all works fine except the problem is that what I am using to populate the text box have very long titles (they are journal articles and presentation titles). The dropdown box extends to the width of the longest element, which stretches off the edge of the screen, therefore making the scrollbar impossible to reach. I have tried various methods of trying to manually set the dropdown box using CSS to a particular width, but so far to no avail. The best I have accomplished it to set the Select box to a certain width but the dropdown menu itself is much, much wider.

Any tips on this would be greatly appreciated.

EDIT:

It turns out that the following CSS line works in all of the primary browsers except for Google Chrome (which is what I was testing the page in). If a solution for Chrome is known, that would be good to know about.

select, option { width: __; }

解决方案

You can style (albeit with some constraints) the actual items themselves with the option selector:

select, option { width: __; }

This way you are not only constraining the drop-down, but also all of its elements.

这篇关于在HTML中选择下拉选项中设置下拉元素的宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！