Html Safari浏览器中的中心元素
我有一个简单的页面:Html Safari浏览器中的中心元素,html,css,safari,center,centering,Html,Css,Safari,Center,Centering,我有一个简单的页面: <!DOCTYPE html><html><head><title>Choose your Location - ChubbyParade.com</title> <style type="text/css"> #sv_btn_container{ display:block; text-align:center; margin:0px auto; } #sbm_btn{
<!DOCTYPE html><html><head><title>Choose your Location - ChubbyParade.com</title>
<style type="text/css">
#sv_btn_container{
display:block;
text-align:center;
margin:0px auto;
}
#sbm_btn{
margin-left:auto;
margin-right:auto;
}
#location_selector{text-align:center;}
</style>
</head>
<body>
<div id="location_selector" style="width:300px;padding:1em;margin:0;border:1px solid #999999">
<form>
<div>Please choose your location</div>
<div id="selectors">
<div>
<select name="country" style="padding:0.5em">
<option>Country</option>
<!--etc.-->
</select>
</div>
</div>
<div style="clear:both"></div>
<div id="sv_btn_container" style="margin-top:0.5em" align="center">
<input type="submit" id="sbm_btn" value=" SAVE " class="button" style="display:none" />
</div>
</form>
</div>
</body></html>
选择您的位置-ChubbyParade.com
#sv_btn_集装箱{
显示:块;
文本对齐:居中;
保证金:0px自动;
}
#sbm_btn{
左边距:自动;
右边距:自动;
}
#位置选择器{文本对齐:居中;}
请选择您的位置
国家
我使用javascript动态显示submit按钮,方法是将其显示样式设置为“block”(在上面的脚本中未显示)
我希望提交按钮居中
但无论我尝试了自动边距和文本对齐的哪种组合,该按钮都将显示在其容器的左侧。设置提交按钮的宽度,例如:
#sbm_btn{
margin-left:auto;
margin-right:auto;
width:100px;
height:30px;
}按钮需要设置宽度:
#sbm_btn{
width: 200px;
margin-left:auto;
margin-right:auto;
}
如果不为btn设置宽度,您将执行以下操作:
#sbm_btn {
display:inline-block;
}
其他的在这里很好用-。您能在JSFIDLE不起作用的地方提供它吗?(包括javascript)该死!这使我在旅行中绊倒了<代码>内联块解决了这个问题。谢谢