Html 尝试使用CSS将Wufoo表单居中放置在iframe中

我正在使用Wufoo作为web表单。表单位于iframe中的我的页面中。它们允许您使用自定义CSS设置表单样式。我试着把表单放在iframe的中心

以下是我在iframe中显示表单时从页面中获取的HTML：

<div id="container" class="ltr">
    <form id="form2" name="form2" class="wufoo topLabel page1 hideHeader" accept-charset="UTF-8" autocomplete="off" enctype="multipart/form-data" method="post" novalidate="true" action="https://peakinbound.wufoo.com/embed/mtco4fp0qomvz2/def/&amp;header=hide#public">
        <ul>
            <li id="fo2li1" class="notranslate">
                <label class="desc" id="title1" for="Field1">
                    Name<span id="req_1" class="req">*</span>
                </label> 
                <span> 
                    <input id="Field1" name="Field1" type="text" class="field text fn" value="" size="8" tabindex="1" onkeyup="handleInput(this);" onchange="handleInput(this);" required="true" />
                    <label for="Field1">First</label>
                </span>
                <span>
                    <input id="Field2" name="Field2" type="text" class="field text ln" value="" size="14" tabindex="2" onkeyup="handleInput(this);" onchange="handleInput(this);" required="true" />
                    <label for="Field2">Last</label>
                </span>
            </li>
            <li id="fo2li3" class="notranslate">
                <label class="desc" id="title3" for="Field3">
                    Email<span id="req_3" class="req">*</span>
                </label>
                <div>
                    <input id="Field3" name="Field3" type="email" spellcheck="false" class="field text medium" value="" maxlength="255" tabindex="3" onkeyup="handleInput(this);" onchange="handleInput(this);" required="true" />
                </div>
            </li>
            <li class="buttons ">
                <div>
                    <input type="hidden" name="currentPage" id="currentPage" value="jssDPjBF2iK6t1UvInla0mSUbe82kYF5HwuBetLwuBe5y49jw=" />
                    <input id="saveForm" name="saveForm" class="btTxt submit" type="submit" value="GET INFO" onmousedown="doSubmitEvents();" />
                </div>
            </li>
        </ul>
    </form>
</div>
<!--container-->

有没有关于如何使表单居中的想法

---

谢谢您的帮助。

您需要申报一个px计量单位。

---

你能提供一些图片吗？在宽度和高度上添加了“px”。表单仍然没有居中。谢谢。是我干的。仍然没有居中。除非有其他样式覆盖它，否则它应该可以工作。我的示例是从您的代码示例派生出来的，但是您有一个iframe。iframe是在#容器内还是在其他地方？容器在iframe.Hmm中。它是Wufoo，所以可能有一些东西我看不到在他们这边。你需要一个容器包装iframe，以便能够将其居中。请参阅更新的答案。

#container {
    width: 350;
    height: 250; 
    margin:0 auto;
}

#iframe-container {
    width: 350px;
    height: 300px; 
    margin:0 auto;
}
#iframe-container > iframe {
    overflow-y: auto;
    border: none;
    height: 100%;
    width: 100%;
}