CSS :nth-of-type() bug

.tools-hover-box-list-item {
pointer-events: auto;
box-sizing: border-box;
display: flex;
flex-flow: row nowrap;
justify-content: flex-start;
align-items: flex-start;
width: 140px;
margin-top: 14px;
&:nth-of-type(4n + 1) {
margin-top: 20px;
}
// &:nth-of-type(1 + 4n) {
// margin-top: 20px;
// }
// &:hover {
// box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1);
// }
}

https://developer.mozilla.org/en-US/docs/Web/CSS/:nth-of-type

demo

See the Pen css nth-of-type bug by xgqfrms
(@xgqfrms) on CodePen.

css n-type-of not working


refs



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


CSS :nth-of-type() bug的更多相关文章

  1. vue bug & data type bug

    vue bug & data type bug [Vue warn]: Invalid prop: type check failed for prop "value". ...

  2. CSS中常见的BUG调试

    1.布局--layout 布局是windows提出的概念,用于控制元素的尺寸和定位. 拥有布局的元素负责自身及其子元素的尺寸及定位,而没有布局的元素仅仅能依靠近期的祖先元素进行控制. 通常在IE6中出 ...

  3. CSS的兼容性与BUG处理

    骨灰级清除浮动 .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility ...

  4. CSS修改input[type=range]滑块样式

    input[type="range"]是html5中的input标签新属性,样子如下: <input type="range" value="4 ...

  5. CSS美化 input type=file 兼容各个浏览器(转)

    HTML代码: <FORM> <A class=btn_addPic href="javascript:void(0);"><SPAN>< ...

  6. css重点知识和bug解决方法

    1.图片向下撑大3像素问题 在一个盒子里面放一张图片,默认情况下,图片会向下撑大3像素,有以下几种解决方法: 1.1 给图片添加display:block: 1.2 给图片添加 float:left: ...

  7. css 重点知识 和 bug 解决方法

    1.图片向下撑大3像素问题 在一个盒子里面放一张图片,默认情况下,图片会向下撑大3像素,有以下几种解决方法: 1.1 给图片添加display:block: 1.2 给图片添加 float:left: ...

  8. CSS的一个小bug,Gradient has outdated direction syntax. New syntax is like `to left` instead of `right`.

    在vue重新渲染页面的时候,报了一个错误: 翻译了报错信息后,Gradient has outdated direction syntax. New syntax is like to left in ...

  9. ie6,ie7,ie8 css bug兼容解决方法

    IE浏览器以不支持大量的css 属性出名,同时也因其支持的css属性中存在大量bug. 这里收集了好多的bug以及其解决的办法,都在这个文章里面记录下来了!希望以后解决类似问题的时候能够快速解决,也希 ...

  10. ie6,ie7,ie8 css bug兼容解决记录

    ie6,ie7,ie8 css bug兼容解决记录 转载自:ie6,ie7,ie8 css bug兼容解决记录 - 前端开发 断断续续的在开发过程中收集了好多的bug以及其解决的办法,都在这个文章里面 ...

随机推荐

  1. Centos 安装postgreSQL9.4.3

    rpm -ivh http://download.postgresql.org/pub/repos/yum/9.4/redhat/rhel-7.2-x86_64/pgdg-centos94-9.4-3 ...

  2. 在vCenter Server中添加ESXi 主机失败的问题

    报错:出现了常规系统错误: Timed out waiting for vpxa to start 报错是这个,我看了下vcenter的版本是6.5,如图右上,这个报错是因为我ESXI主机是6.7的, ...

  3. jemeter断言和性能分析

    一.添加断言 1.原因:检查是否有该结果,一般一个请求过去除了400和500的只要通过的都会代表请求成功,比如登录页面及时填写了错误密码,虽然会返回密码错误,但这个请求还是成功的,所以我们要添加断言, ...

  4. 1、剑指offer-数组——二维数组中的查找

    *题目描述* **在一个二维数组中(每个一维数组的长度相同),每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序.请完成一个函数,输入这样的一个二维数组和一个整数,判断数组中是否含 ...

  5. memset 在c++中使用细节注意

    C语言,在利用struct进行数据封装时,经常会使用memset(this,0,sizeof(*this))来初始化.而C++中,有时候也会用到struct,在利用memset进行初始化时,非常容易踩 ...

  6. Java通过openOffice实现word,excel,ppt转成pdf实现在线预览

    Java通过openOffice实现word,excel,ppt转成pdf实现在线预览 一.OpenOffice 1.1 下载地址 1.2 JodConverter 1.3 新建实体类PDFDemo ...

  7. 误删eth1或者 eth0

    不小心把机房,eth1删除了,过2天还演示,折腾一下午.... 首先eth1存在地方是2块./etc/sysconfig/network-scripts/下 /et/sysconfig/network ...

  8. 制作MySQL的Windows服务+创建用户及授权

         在上一篇随笔中详述了MySQL的Windows 64位版本的安装,以及初始化操作.启动服务端.客户端连接.一些基本的文件操作等.然而在进行这些操作的时候,需要我们去输入一长串的路径和命令才能 ...

  9. 闲聊CAP、BASE与XA

    CAP理论与BASE理论 首先要和大家说的就是大名鼎鼎的CAP理论与BASE理论了,这两个理论与解决分布式事务问题是密切相关的. 其实网上有很多关于CAP与BASE相关的文章,一写就写了一大堆,篇幅很 ...

  10. CPU中的程序是怎么运行起来的(预告篇)

    总述     最近一位朋友问我,我开发的代码是怎么运行起来的,我就开始给他介绍代码的预编译.汇编.编译.链接然后到一般的文件属性,再到代码运行.但是大佬问了我一句,CPU到底是怎么执行到每一个逻辑的, ...