jQuery UI 自动完成包装结果

Question

在窄屏幕上使用自动完成功能时，结果会出现在一个窗口中，您需要左右滚动才能看到它们。我在 .ui-autocomplete.ui-menu 中添加了一个 max-width 并设置了一个较小的字体，现在结果只和屏幕一样宽，但不换行右边的信息是隐藏的。我将 .ui-menu-item 设置为换行，但是在 chrome 开发人员工具中，当我查看元素样式时，在 element.style 下它仍然显示 nowrap 和我的条目被标出。我不确定 element.style 是什么或如何覆盖它。我尝试了 !important 标志，但这没有帮助。关于如何覆盖该样式或使结果换行的更好方法有什么建议吗？

好的，还有更多: 我使用默认的 jQuery UI JS 和 CSS。我补充说: 这个 CSS 在我脑海的尽头:

.ui-autocomplete.ui-menu{
 max-width:90%;
 }

 .ui-menu-item{
  white-space:wrap!important;
  overflow-wrap: break-word;
  word-break: break-all;
  }

这是开发控制台的 CSS 信息:

Answer 1

你必须正常而不是换行。

空白:正常!重要；