-3

1つのボタンを上に、もう1つのボタンを下に中央揃えしたい。CSSを編集してこれを達成するにはどうすればよいですか

css-

#ContactForm .button {
margin-left:8px;
margin-left:9px;
float:right;
margin-right:2px;
font-size:20px;
font-weight:700;
color:#fff;
line-height:35px;
width:90px;
text-align:center;
background:url(../images/button_form.gif) top repeat-x #308da2;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;behavior:url(js/PIE.htc);
position:relative;
text-decoration:none
}

html-

<div>
  <a href="#" class="button" onclick="document.getElementById('ContactForm').submit()">send</a>
  <a href="#" class="button" onclick="document.getElementById('ContactForm').reset()">clear</a>
</div>
4

2 に答える 2

2

これがあなたが欲しいものを備えたjsfiddleです.... http： //jsfiddle.net/xgdVM/

コンテナのテキスト配置を中央に設定し、ボタンの表示プロパティをブロックに設定できます。

CSS：

#form{text-align:center;}
a{display:block;}​

HTML

 <div id="form">
     <a href="#" class="button" onclick="document.getElementById('ContactForm').submit()">send</a>
     <a href="#" class="button" onclick="document.getElementById('ContactForm').reset()">clear</a>
 </div>​

または、ボタンの幅が設定されている場合、つまり、ボタンwidth:70px;にcssプロパティを指定するだけmargin:0 auto;で、左右に等しいマージンを適用することでボタンが中央に配置されます。

http://jsfiddle.net/xgdVM/2/

于 2012-12-12T08:59:26.877 に答える
0

水平方向に中央揃えを意味する場合:

#ContactForm .button {
    margin: 0 auto; /* centers, provided there's a width set */
    display: block;
    font-size:20px;
    font-weight:700;
    color:#fff;
    line-height:35px;
    width:90px; /* width set */
    text-align:center;
    background:url(../images/button_form.gif) top repeat-x #308da2;
    border-radius:10px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;behavior:url(js/PIE.htc);
    position:relative;
    text-decoration:none
}
于 2012-12-12T09:17:57.833 に答える