我有一个 div,“theform”里面的“top”,我希望它居中,2em 用于上边距。它居中但不是 2em 的顶部边距。和 -webkit-box-align: 居中;也不起作用,因为我需要以“mainphoto”为中心。
有什么想法吗?利润率可能崩溃?如果是的话,我找不到解决办法。
HTML
<div id="wrapper">
<body>
<?php
?>
<div id="theform">
<form>
<div id="top">
<div id="mainphoto">
</div>
<div id="title">
</div>
</div>
</form>
</div>
</body>
</div>
CSS
*{
font-size:100%;
margin: 0em;
padding: 0em;
}
body{
width: 100%;
}
#mainphoto{
display:-webkit-box;
width:22em;
height:17em;
border:1px solid red;
}
#theform{
display:-webkit-box;
-webkit-box-orient: vertical;
width: 55em;
overflow:auto;
border:1px black solid;
}
#title{
display:-webkit-box;
}
#top{
-webkit-box-orient: horizontal;
-webkit-box-align: center;
margin: 2em auto;
width: 50em;
height:20em;
overflow:auto;
border:2px red solid;
}
#wrapper{
display:-webkit-box;
-webkit-box-orient: horizontal;
-webkit-border-radius:0.9em;
box-shadow: 3px 10px 5px #888888;
margin: 3em auto;
width: 80em;
height:52em;
}
最佳答案
为你的#mainphoto
添加边距使其居中
#mainphoto{
display:-webkit-box;
width:22em;
height:17em;
margin:2em auto 0 auto;
}
工作 demo
希望对你有帮助
关于html - margin 不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15736499/