如何获得选择退出移动

Question

我有以下情形：

<span> 
     <input checked="checked" id="rad" name="rad" type="radio" value="1" /> Opt1 
     <br /> 
     <input id="rad" name="rad" type="radio" value="2" /> Opt2 
</span> 

<span> 
     <button id="btn">Find</button> 
</span> 

在形式加载，按钮是不可见的。当用户点击选项按钮（rad）时，btn按钮变为可见。

工作完美，只有一个例外。当按钮出现时，它会使第二行的大小增大，并且opt1和opt2之间的空白区域增加。所以从用户的角度来看，它看起来像下方的单选按钮正在移动。

我该如何解决这个问题？

感谢

Answer 1

很难说没有看到整体布局。但根据我的理解，我会做出第一个跨度display: inline-block，这将迫使它被视为一条线上的一个元素。

Answer 2

适当的形式布局自己的话题：

http://www.alistapart.com/articles/prettyaccessibleforms