开发者

Centering an input button in CSS on Google Chrome for Mac

I'm trying to center input fields and buttons ( tags) in an html form. I'm doing that with auto left and right margins. That works fine on most browsers but doesn't centre on Chrome for Mac (it does on Chromium for Linux):

<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>
  </bo开发者_开发问答dy>
</html>

I expect to see the button centered within the form but on Chrome Mac I see it on the left hand side. If I give it an explicit width the button centers, or if I use another form element like a textarea, but those aren't very satisfactory solutions.


Remove the display block from the button;

<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> 

try this.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜