居中形式动态添加元素保持中心？

我有一个基本的HTML表单，我居中。我使用jQuery插件来动态验证字段是必需的。当它在文本框后面添加“Field is required”字段时，它会导致表格/表格由于它位于表格中而发生移位。这是有道理的。居中形式动态添加元素保持中心？

我的问题是什么是最好的方式来保持表格/窗体为中心在页面上，但允许任何动态添加元素添加“之后”的文本框不转移窗体？看到这里我的例子：http://jsbin.com/amasa4/3/

我不一定需要它来保持一个表，如果它是更容易完成，无需同时保持相同的风格。

来源

2010-10-23 aherrick

我所做的一切来解决这个设置标签类动态添加到绝对错误的。这样我仍然可以使用CSS将表格居中。

来源

2010-10-25 01:18:33 aherrick

我现在使用的解决方案是用JavaScript而不是css中心表（margin: 0 auto;）。我有我的表单在某种模式对话框中。所以对于我的情况下，函数的样子：

$.fn.center = function() { 

    this.css("position", "absolute"); 

    this.css("left", "50%"); 

    this.css("margin-left", -((this.width())/2) + "px"); 

    return this; 

}

，是的，如果你在你的表格多个步骤，你将有你每次去下一个或前一步骤的时间居中你的表。

这里是demo

编辑：我创建了以下hack，看起来真的很丑陋，但如果你是绝望的，没有其他的解决方案，您可以使用它=）我所做的有添加表单前的虚拟div，并根据表单的宽度使用javascript调整大小。您可以使用1个表格而不是2个div，然后调整第一个虚拟列的大小。另外请注意，您将需要在窗口大小调整事件中再次调整整个事件。

来源

2010-10-23 04:24:15

感谢您的回答。这让我一半在那里。现在我遇到的问题是文档中表格下方的任何div都会丢失它们的流量。看到这里：http：//jsbin.com/amasa4/5/edit我不能真正引入额外的div divs，因为页脚处于主页面而表格在索引页面中。这一切都可能没有JS？ – aherrick 2010-10-23 13:12:49

我已经更新了我的答案，现在看不到任何更好的解决方案。 – 2010-10-24 10:36:21

感谢您的帮助。结束了一个更简单的解决方案仍然使用CSS来居中表单！ – aherrick 2010-10-25 01:19:43

尝试增加给你的CSS：

label{ 
    display:block; 
    } 
    td{ 
    vertical-align:top; 
    }

来源

2010-10-24 21:01:47

居中形式动态添加元素保持中心？

回答

相关问题