html - CSS 位置:绝对不能在 IE11 上正确显示
问题描述
我有一个使用绝对位置的 html 和 css 代码。它在 chrome 和 firefore 上运行良好。但似乎 svg 类中的 position absolute 属性在 IE 中不起作用,使得 svg 图像不在边框中。
我的html:
<div class="slider">
<i class='left-arrow'><svg viewBox='0 0 100 100'><path d='M 10,50 L 60,100 L 70,90 L 30,50 L 70,10 L 60,0 Z'/></svg></i>
<i class='right-arrow'><svg viewBox='0 0 100 100'><path d='M 10,50 L 60,100 L 70,90 L 30,50 L 70,10 L 60,0 Z' transform='translate(100, 100) rotate(180) '/></svg></i>
</div>
我的CSS:
.slider i {position:absolute;top:40%;width:50px;height:50px;cursor:pointer;z-index: 4;margin:0;border:2px solid #fff;border-radius:100%;}
.slider > i:hover {background:#333133;border-color:#333133;transition: all .3s;}
.slider > i svg {position:absolute;fill:#fff;padding:20%;}
有没有办法解决这个问题,请帮助我。感谢大家。
解决方案
https://developer.mozilla.org/en-US/docs/Web/HTTP/Browser_detection_using_the_user_agent
只需检测浏览器是否为 IE11 并更改 IE11 的设计
推荐阅读
- python - 使 PropertyMock 包装现有属性 - Python
- c++ - 为什么添加功能在链表中不起作用
- css - 使用 Drupal Bootstrap 是否可以允许某些用户查看药丸但不允许其他用户查看药片?
- javascript - JS Array.find 如果未定义的元素
- postgresql - Postgres 11.7 中具有太多连接或多态关系的表的设计问题
- c# - 有没有办法在使用 CSVHelper 阅读时忽略 readContext.rawrecord 中的“/r/n”
- c# - 使用 C# 读取 JSON 文件
- c# - 如何通过 ViewModel 将 Listview 中的项目文本传输到新页面?
- postgresql - 带有 PostgreSQL SELECT 查询的 Powershell 返回错误的结果
- javascript - 反应状态落后一步(不重复!)