设置div样式以避免控制位移

Question

我有三个div，我将float:left并排设置。 在所有这三个div中，我有一个textbox，一个checkbox和一个button。我最初将checkbox设置为visible = false。点击button我将checkbox可见性设置为true。通过这个div位置调整到左边并导致布局问题。如何设置div样式以避免这种布局位移问题。我希望在显示和隐藏checkbox时我不应该有任何控制位移我是css中的新手。

这是我的小提琴链接Link

Answer 1

如何使用css属性visibility？ visibility属性允许隐藏元素，但保留原本所在的空间。有关它的更多信息，请阅读here。

DEMO ：http://jsfiddle.net/Lppme028/22/

<强> CSS

#txt
{
    visibility: hidden;
}

<强>的JavaScript

$(document).ready(function () {    
    $("#btn").click(function (){
        $("#txt").visibilityToggle();
    }) 
}); 

jQuery.fn.visibilityToggle = function() {
    return this.css('visibility', function(i, visibility) {
        return (visibility == 'visible') ? 'hidden' : 'visible';
    });
};