0

次のコードがあり、div 内のすべての入力を中央に配置しようとしています。

CSS スニペットは次のとおりです。

#mainCalc label {
    display: inline;
    width: 8em;
    text-align: right;
    padding-right: 1em;
        float: left; }

#mainCalc input {

    display: inline;         
    float: left; }

#mainCalc br {
    clear: left;

HTML スニペットは次のとおりです。

<div id="mainCalc">
  <input type="button" id="dollar" value="Dollar" />
  <input type="button" id="quarter" value="Quarter" />
  <input type="button" id="dime" value="Dime" />
  <input type="button" id="nickel" value="Nickel" />
  <input type="button" id="refund" value="Refund" /><br />
  <label for="amount">$</label>
  <input type="text" id="amount" /><br/>
  <input type="button" id="coke" value="Coke" />
  <input type="button" id="dietCoke" value="Diet Coke" />
  <input type="button" id="mountainDew" value="Mountain Dew" />
  <input type="button" id="drPepper" value="Dr. Pepper" />
  <input type="button" id="rootBeer" value="Root Beer" />
  <input type="button" id="water" value="Water" /> <br /><br />
</div>
4

2 に答える 2

0

入力に幅を与える必要があり、次に float を削除して margin: 0 auto を追加する必要があります。

input{
width: 200px;
margin: 0 auto;
display: block;
}

作業例:

http://jsfiddle.net/DYgnU/2/

于 2013-04-01T21:37:47.377 に答える