你好我在ipad上找到一种在safari中居中div的方法很麻烦...这在ipad上使用chrome但是safari不能以横向格式缩放...左边和右边都是边距但我必须滚动整个事情。是否有任何想法可以在浏览器..色彩和野生动物园中使用?
HTML:
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
</head>
<body>
<div id="wrapper">
</div>
</body>
</html>
CSS:
#wrapper{
margin: 0 auto;
width:90%;
height:90%;
background-color: black;
}
html, body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
答案 0 :(得分:2)
我就是这样做的。这是example
HTML:
<div id="wrapper">
<div class="outer">
<div class="inner">
<div class="content">
</div>
</div>
</div>
</div>
CSS:
#wrapper{
position: absolute;
top:0;
bottom:0;
left:0;
right:0;
}
.outer{
display:table;
table-layout:fixed;
height:100%;
width:100%;
}
.inner{
display:table-cell;
text-align:center;
vertical-align:middle;
width:100%;
position:relative;
}
.content{
width:90%;
height:90%;
background:red;
display:inline-block;
}
答案 1 :(得分:0)
如果您要将width
定义为90%
,则可以避免此问题,只需设置margin: 0 5%;