在Google Chrome for Mac中将输入按钮居中放置在Google Chrome中

我试图在html窗体中居中输入字段和按钮（标记）。我用自动左右边距来做这件事。这适用于大多数浏览器不错，但对Mac上的浏览器不居中（它在铬对于Linux）：在Google Chrome for Mac中将输入按钮居中放置在Google Chrome中

<html> 
    <body> 
    <form style="width: 300px; display: block; text-align: center; background: red;"> 
     <input value="Centre" type="submit" style="display: block; margin: 10px auto; background: green;" /> 
    </form> 
    </body> 
</html>

我希望看到该按钮的形式内，但在Chrome的Mac为中心的我看到它的左手边。如果我给它一个明确的宽度的按钮居中，或者如果我使用另一个表单元素，如textarea，但这些都不是非常令人满意的解决方案。

来源

2010-11-05 Marc Sutton

如果行为不同于操作系统和操作系统，那么我认为你遇到了Chrome/Webkit的bug。 – 2010-11-05 11:56:35

从按钮上移除显示块;

<html> 
    <body> 
    <form style="width: 300px; display: block; text-align: center; background: red;"> 
     <input value="Centre" type="submit" style=" margin: 10px auto; background:none; border:none; background-color:green;" /> 
    </form> 
    </body> 
</html>

试试这个。

来源

2010-11-05 12:00:01 cac

这是有效的，但我有实际的页面更复杂，并有一个接一个的输入（一些文本字段，一些按钮），我想在新的线上。我应该让他们'显示：内联';'并在其间添加
标签，是否有更优雅的解决方案？你也可以解释为什么这有效吗？ – 2010-11-05 12:17:43

会帮助你，或者你可以用ul - > li来包装em。并使用CSS来获得所需的效果。 – cac 2010-11-05 12:27:43

在Google Chrome for Mac中将输入按钮居中放置在Google Chrome中

回答

相关问题