jquery - jQuery UI 自动完成包装结果

Question

当使用窄屏幕自动完成时，结果会出现在一个窗口中，您需要左右滚动才能看到它们。我添加了一个max-widthto.ui-autocomplete.ui-menu并设置了一个较小的字体，现在结果仅与屏幕一样宽，但不换行并且右侧的信息被隐藏。我设置.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 信息：

标签： jquerycssjquery-ui-autocomplete

Answer 1

你必须正常而不是换行。

空白：正常！重要；