Hoe lijn je een invoertag uit met het midden zonder de breedte op te geven?

#siteInfo input[type="button"] {
  background: none repeat scroll 0 0 #66A3D2;
  border-color: #FFFFFF #327CB5 #327CB5 #FFFFFF;
  border-radius: 10px 10px 10px 10px;
  border-style: solid;
  border-width: 1px;
  box-shadow: 1px 1px 3px #333333;
  color: #FFFFFF;
  cursor: pointer;
  font-weight: bold;
  padding: 5px;
  text-align: center;
  text-shadow: 1px 1px 1px #000000;
}

<div id="siteInfo">
  <p>Some paragraph.</p>
  <input type="button" value="Some Button">
</div>

Antwoord 1, autoriteit 100%

Je moet de text-align:centerop de bevattende div plaatsen, niet op de invoer zelf.

Antwoord 2, autoriteit 18%

U kunt de volgende CSS gebruiken voor uw invoerveld:

.center-block {
  display: block;
  margin-right: auto;
  margin-left: auto;
}

Update vervolgens uw invoerveld als volgt:

<input class="center-block" type="button" value="Some Button">

Antwoord 3, autoriteit 14%

schrijf dit:

#siteInfo{text-align:center}
p, input{display:inline-block}

http://jsfiddle.net/XfSz6/

Antwoord 4, autoriteit 3%

U kunt deze twee eenvoudige lijncode gebruiken:

   display: block;
    margin:auto;

<table>
   <tr>
     <td align="center">
        <input type="button" value="Some Button">
     </td>
   </tr>
</table>

<center><form></form></center>