#center {
position: absolute;
top:35%;
text-align: center;
z-index:100;
}
#add_form {
margin:0 auto;
width:90%;
/*height:20em;*/
background-color: #f0f0f0;
position: relative;
}
#add_form p {
font-size: 1em;
padding-top:25px;
padding-right:25px;
padding-left:25px;
text-align: left;
}
#userID {
width:80%;
height:2em;
margin-top:0px;
margin-bottom:5px;
border-radius: 5px;
border:1px #D3D3D3 solid;
font-size: 1.5em;
padding-left:10px;
letter-spacing: 2px;
text-align: center;
}
#submitGetCancel, #submitGetCheck {
width:50%;
height:3em;
background-color: red;
color: #740000;
font-size: 1em;
border-style: none;
}
<div id="center">
<div id="add_form">
<p>Some String</p>
<input type="text" id="userID" name="userID">
<!-- <br/> -->
<div id="buttons">
<button type="button" id="submitGetCancel" onclick="closeForm();">Cancel</button>
<button type="button" id="submitGetCheck">confirm</button>
</div>
</div>
</div>
我想要的是将每个按钮的宽度设置为50%,以便将它们放置在每侧。
问题出在哪儿?
您可以使用 float:left
#center {
position: absolute;
top:35%;
text-align: center;
z-index:100;
}
#add_form {
margin:0 auto;
width:90%;
/*height:20em;*/
background-color: #f0f0f0;
position: relative;
}
#add_form p {
font-size: 1em;
padding-top:25px;
padding-right:25px;
padding-left:25px;
text-align: left;
}
#userID {
width:80%;
height:2em;
margin-top:0px;
margin-bottom:5px;
border-radius: 5px;
border:1px #D3D3D3 solid;
font-size: 1.5em;
padding-left:10px;
letter-spacing: 2px;
text-align: center;
}
#submitGetCancel, #submitGetCheck {
float:left;
width:50%;
height:3em;
background-color: red;
padding:0;
color: #740000;
font-size: 1em;
border-style: none;
}
<div id="center">
<div id="add_form">
<p>Some String</p>
<input type="text" id="userID" name="userID">
<!-- <br/> -->
<div id="buttons">
<button type="button" id="submitGetCancel" onclick="closeForm();">Cancel</button>
<button type="button" id="submitGetCheck">confirm</button>
</div>
</div>
</div>
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句