jquery - 使用 jQuery slideToggle 扩展 Div

Question

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

http://67.212.188.229/fcf/index.html <- 请查看右侧面板，我希望用户单击其中一个并让框展开其内容。我有点击和内容，但无论出于何种原因，我都无法让 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 都是可见的。