如何居中表单的子元素？

我有我的JavaScript和结束动态创建如下形式：如何居中表单的子元素？

mybreak=document.createElement("p"); 
form.appendChild(mybreak); 

var buttonElement = document.createElement('button'); 
buttonElement.setAttribute("type","submit"); 
buttonElement.innerHTML="<img src=\"images/lock.png\" width=\"80\" height=\"80\" alt=\"Submit\"/>Try it!"; 
form.appendChild(buttonElement);

这导致我的提交按钮的页面上被左对齐。我希望它集中在页面上。在innerHTML中添加按钮内的文本，这不是我想要的。将align = center属性添加到我的孩子具有相同的效果。

我错过了这里有什么诀窍让这个提交按钮很好地集中在页面上？

感谢

来源

2012-09-11 Lolo

我感到奇怪的回答我的问题，但我在后，了解如何中心我从JavaScript严格的提交按钮，因为我创建表单动态地只需要最后一个提交按钮居中。

的解决方案是简单修改我原来的代码如下：

newDiv = document.createElement("div"); 
newDiv.setAttribute("align","center"); 

var buttonElement = document.createElement('button'); 
buttonElement.setAttribute("text-align","center"); 
buttonElement.setAttribute("type","submit"); 
buttonElement.innerHTML="<img src=\"images/lock.png\" width=\"80\" height=\"80\" alt=\"Submit\"/>Try it!"; 
newDiv.appendChild(buttonElement); 
form.appendChild(newDiv);

来源

2012-09-13 05:12:57 Lolo

添加一些CSS为保存按钮<p>。

p { 
    text-align:center; 
}

来源

2012-09-11 18:32:30 j08691

我很抱歉，但我仍不清楚我如何从JavaScript做到这一点，因为我动态创建的形式。 – Lolo

只需链接到样式表或在页面头部添加样式即可。 – j08691

使用CSS：

#element_containing_submit_btn { text-align: center; }

http://jsfiddle.net/egd9G/

来源

2012-09-11 18:32:42

如何居中表单的子元素？

回答

相关问题