Bug Chrome (Webkit)：边框样式与边框半径的虚线
Bug Chrome (Webkit)：边框样式与边框半径的虚线
提问于 2017-07-27 00:20:53
我在chrome (和safari)上遇到了一个问题，当我试图创建一个带有虚线边框和边框半径的框时，边框宽度看起来更小了。
当边框半径设置为2px或更大时，会出现此错误。
我的代码：
div {
margin: 10px;
padding: 10px;
}
.border {
border: 1px dashed black;
}
.radius-1 {
border-radius: 1px;
}
.radius-2 {
border-radius: 2px;
}
.radius-10 {
border-radius: 10px;
}<body>
<div class="border">
No radius
</div>
<div class="border radius-1">
radius 1px
</div>
<div class="border radius-2">
radius 2px
</div>
<div class="border radius-10">
radius 10px
</div>
</body>
你知道我为什么要解决这个问题吗?我怎么解决这个问题？
谢谢:)
回答 1
Stack Overflow用户
发布于 2017-07-27 00:33:29
您可以使用em
.border {
border: 0.1em dashed black;
}
div {
margin: 10px;
padding: 10px;
}
.border {
border: 0.1em dashed black;
}
.radius-1 {
border-radius: 1px;
}
.radius-2 {
border-radius: 2px;
}
.radius-10 {
border-radius: 10px;
}<body>
<div class="border">
No radius
</div>
<div class="border radius-1">
radius 1px
</div>
<div class="border radius-2">
radius 2px
</div>
<div class="border radius-10">
radius 10px
</div>
</body>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/45332518
复制相关文章
相似问题
腾讯云开发者
