我制作了一个简单的正在建设中的网站，该网站的图像和一些文本位于页面中间，如下所示：
HTML代码：
<body>
<div id="container">
<span id="wip">Under Construction</span>
<img id="image" src="katte.jpg">
<span id="text">Glæd dig, her åbner katteboxen.dk i foråret 2015. Vi glæder os til at forkæle din kat med en spændende pakke hver måned.</span>
</div>
</body>
CSS代码：
body {
margin: 0;
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-weight: 700;
text-align: center;
}
#container {
max-width: 1230px;
width: 100%;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
#image {
width: 100%;
}
#text {
font-size: 20px;
padding: 0 15px;
display: block;
}
#wip {
font-size: 40px;
padding: 0 15px;
display: block;
}
除了iPad以外，其他所有东西都运作良好。内容显示时，例如transform: translate(-50%, -50%);未对容器应用css规则时。解决此问题的替代方法有哪些？任何指导或反馈都非常受欢迎。
变换属性是基于浏览器的属性集-webkit-transform，-moz-transform，-o-transform ....因此，请根据您的i-pad浏览器设置它，这将解决问题
或只是使用
margin-left:-50%;
margin-top:-50%;
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句