jquery - 保持大小，当 $.empty() - 不显示 :block;

Question

我有一个小问题，因为这个问题可能很简单......我想我忽略了一些东西。

无论如何，我正在创建一个交互式表单，用户可以在其中单击 li项目，单击它们时会出现“勾号”图标。但是，由于某种原因，当您单击其他li时项目，上一个的尺寸li达到 1px..

我使用$.empty ，因为“勾号”是通过使用 FontAwesome SVG 图标库创建的，所以通过附加 <i class="fa fa-icon"></i>到单击的列表项。但是，要删除该勾号，并将其附加到新单击的li项目，我使用Jquery $.empty .. 这使得 li项目，很小。

看看这个 fiddle ，看看我的意思。 http://jsfiddle.net/t6exT/9/

希望有人能给我一个很好的解决方案。谢谢!

P.s.解决方案不能是 display:block; ，因为我需要display:table;让“刻度”垂直(和水平)居中。

Answer 1

您可以尝试使用::after 伪类强制装箱。

即

#questions li::after {
    display:table-cell;
    content: ''
}

http://jsfiddle.net/t6exT/11/