带有超链接右侧图标的JQuery UI

我正在尝试在超链接的右侧放置一个图标（使用JQuery UI主题）。 然而，我得到的最满意的结果是页面最右侧的图标，而不是在实际文本之后。 最简单的选择是在文本后面有一个标签，但图标需要使用当前主题设置样式。

这就是我所拥有的：

 ....  Loading...  ...  $(function() { $('#contractLink') .append($('
') .addClass('ui-icon ui-icon-newwin') .css({'float':'right', 'border':'1px solid blue'}) ); });  

Answer 1

您可以display:inline-block图标display:inline-block或display:inline 。 不确定在某些浏览器中对图标会产生什么影响，尽管它会将其与跨度放在同一行。 由于jqueryui css使它display:block ，这可能是不可取的。

或者，您可以使span float:left 。

以上两种工作，在这两种情况下都应该删除float:right的图标div。

Answer 2

将div添加到锚标记不是语义HTML。 新元素（在这种情况下，div应该可能更改为span ）出现在页面右侧的原因是因为您的锚标记上可能没有css width属性。 如果设置了该值，则新的跨度将显示在锚点的最右边界。

Answer 3

我修改了你的代码来改变div的css来显示：inline并且它实现了你正在寻找的效果：

 .css({'display':'inline', 'border':'1px solid blue'}));