我正在尝试设置字段集边框的样式,但由于某些原因在 iOS 8.3 中它无法像其他浏览器一样工作,我已经在 android/PC/mac 上测试了相同的代码,并且它们都可以正常工作他们应该,但是在 iOS 8.3 中,边框要么消失,要么根本不显示,这里是 jsfiddle 的链接在 iOS 8.3 中显示 Safari/chrome 中的错误。
在我看来这是页面缩放工作方式的错误,如果没有元视口(viewport)并且文本非常小,则边框会显示,但是一旦您设置视口(viewport)和/或缩放边框就会消失。
我已经测试了使用不同的 css 规则设置边框样式的不同方法,例如 (border:/border-width/border-top-width),但它们都不起作用。
有没有人可以解决这个问题?
<style>
.border {
border-width:1px;
border-style:solid;
border-color:#000;
}
.border2 {
border: 1px #000 solid;
}
</style>
<fieldset class="border1">
<legend>border1 not working</legend>text content</fieldset>
<br></br>
<fieldset class="border2">
<legend>border2 not working</legend>text content</fieldset>
<div class="border">border1 working</div>
<div class="border2">border2 working</div>
更新 1
删除图例标签可以解决边框问题,但这不是可接受的解决方案。
更新 2
iOS 9.0 修复了该错误。
Best Answer-推荐答案 strong>
到目前为止,使用以下 CSS 规则修复了该错误。
fieldset {
padding-top:10px;
}
legend {
float:left;
margin-top:-20px;
}
不 float 图例标签字段集边框不会显示。
关于html - iOS 8.3 字段集边框错误,我们在Stack Overflow上找到一个类似的问题:
https://stackoverflow.com/questions/30514021/
|