显示/隐藏时边距/填充碰撞div

Question

我有一个包含几个单选按钮的div.这些显示/隐藏文本框.

<p>Some text</p>
<div>
    <div>
        <input id="show" name="radioGroup" type="radio" value="1" /><label for="show">Show</label> - 
        <input id="hide" name="radioGroup" type="radio" value="0" /><label for="hide">Hide</label>
    </div>
    <div class="myTextBox">
         <input type='text'>   
    </div>
</div>

<p>Some text</p>?

当我显示/隐藏时,.myTextBox文本会突然出现几个像素.这是由于文本框上的填充和边距.

没有删除这些设置(填充/边距)有没有办法消除CSS凹凸？

请参阅jsFiddle上的示例http://jsfiddle.net/nTJZN/1/

Answer 1

看到这里.

我正在做的基本上是代替show()和hide()我改变visibility财产.

function ShowHideTextbox()
{
    if($("#show").is(":checked"))
        $(".myTextBox").css('visibility','visible');
    else
        $(".myTextBox").css('visibility','hidden');   
}

​