How do you center a button in css if display is inline?

Question

I tried margin: auto; but it didn't work. I tried margin-left: auto; margin-right: auto;

Answer 1

try
align: center;

Answer 2

if you know differences between inline elements and block level elements, you would understand it. anyway button is inline. to make button act like block, just add ur css display: block;

<style>
body{
border: 1px solid red;
}
button{
width: 100px;
height: 30px;
line-height: 30px;
text-align: center;
display: block;
margin: 0 auto;
border: 1px solid red;
}
</style>
<button>Click Here</button>
<button>Click Here</button>

if you remove the display attributte, you'll understand the difference.

Answer 3

use <center> tag

<center> statement </center>

Answer 4

<center>........</center>