html - CSS3-span标签在内容被删除之前向下移动文本

Question

我有这个复选框：

http://jsfiddle.net/2WZWW/

如您所见，当它被选中时，文本出现在框内，一切看起来都很好。但是一旦您单击它取消选中它，该框的内容就会消失（好事），但Description正在下降。如何防止此文本下降？

Answer 1

添加vertical-align: bottom;到伪元素是一种方法 -内联格式上下文vertical-align中元素的默认值是，当文本消失时，它会根据文本的基线改变它的位置。baseline

.form input[type="checkbox"] ~ label span:before {
    vertical-align: bottom;
}

http://jsfiddle.net/2WZWW/1/