Question

我正在使用JQuery UI sortable，这似乎迫使可排序元素显示：block。

但是，我希望这些元素能够显示：inline-block。

我尝试过使用这个css： .item {display：inline-block！important; }

但它不起作用（由Chrome控制台中的计算样式证明）。

我也尝试使用以下jquery语句： $（'。item'）。css（{display：'inline-block'}）

但这也不起作用。

如何覆盖JQuery UI样式？

Answer 1

您确定要定位正确的课程吗？

我的这个是我的jquery-ui可以排序的，而且效果很好。

#tabs .word-list li {
margin: 3px;
background-color: #FCFCFC;
padding: 7px 16px;
border-radius: 30px;
border-bottom: 2px solid #C7C7C7;
border-right: 2px solid #B1B1B1;
display: inline-block;
}

我也不加载jquery-ui-css文件，我相信它是臃肿的。而且无论如何我都会为这些元素推出我的风格，可能不是你的情况。

更具体地尝试定位。像我一样。 ID-＆GT;类

您也可以在自己的自定义样式之前尝试包含jquery-ui-css文件。

Answer 2

解决方案是设置float：none，这允许显示所需的内联块显示样式。然后我必须设置vertical-align：top以使元素在它们的顶部对齐。总css：

.item {
    float:none;
    display:inline-block;
    vertical-align:top;
}

如何覆盖JQuery UI样式？

2 个答案: