使用jQuery slideToggle扩展Div

Question

任何人都可以为我阐明这一点：

http://67.212.188.229/fcf/index.html＆lt; - 请查看右侧面板，我希望用户点击其中任何一个，并让框展开其内容。我有点击和内容，但无论出于什么原因，我都无法通过内容扩展div。

非常感谢任何帮助。

此致

毫米

Answer 1

你继续使用<form class="fcfSamplePack">：

这种风格

.fcfSamplePack {
    position: absolute;
    width: 247px;
    margin: 10px;
    display:none;
    margin-top: 10px;
}

你需要删除position: absolute;，然后它会按预期工作，目前它不占用正常流程中的任何空间，这意味着它所在的<div>将不会扩展到容纳它。只需删除此样式即可解决问题：）

Answer 2

我在chrome中看到的是你的div正在工作，但文本框比div宽。 div也没有背景颜色，所以我可以看到它下面的内容。我尝试使用以下样式的div，看起来好一点background-color: white; border: 1px red solid; padding: 10px;。文本框变宽的原因是应用于它们的样式具有填充2px，除了宽度100％之外，它还增加了4px的宽度。此外，应用于输入的任何边框都会添加到宽度中。通过这种方式，文本框变得更宽。因此，另一个选项是将文本框的宽度设置为90％。

我还注意到，当我点击输入时，div隐藏了。此外，当我单击第二个按钮和第一个按钮时，两个div都可见。