我最近不得不将一个“隐藏”div(即display:none;)居中,其中有一个表格表单,需要在页面上居中。我编写了以下jQuery来显示隐藏的div,然后将CSS更新为自动生成的表格宽度,并将边距更改为居中。(单击链接可以触发显示切换,但不必显示此代码。)
注意:我之所以分享这段代码,是因为谷歌给我带来了这个堆栈溢出解决方案&除了隐藏元素没有任何宽度,在显示之前无法调整大小/居中之外,其他一切都会起作用。
<div id=“inner”style=“display:none;”><form action=“”><table id=“innerTable”>姓名:电子邮件:电子邮件:</表格></form></div><script language=“JavaScript”type=“text/JavaScript”>$(函数(){$('#inner').show().width($(''#inerTable').widdh()).css('margin','0auto');});</script>
$(函数(){$('#inner').show().width($(''#inerTable').widdh()).css('margin','0auto');});
<script src=“https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js“></script><div id=“inner”style=“display:none;”><form action=“”><table id=“innerTable”>姓名:电子邮件:电子邮件:</表格></form></div>