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. WIFI 国家码和信道划分

    前言 网上百度了很多资料,都没有找到国家码对应支持哪些信道的资料,无奈只能qiang到谷歌,分享给大家完整的WIFI 国家码和信道划分. 安卓WIFI国家码的影响 android中设置wifi国家码的 ...

  2. jmeter的线程数，并发用户数，TPS,RPS 关系解说

    背景 在做性能测试的时候,传统方式都是用并发虚拟用户数来衡量系统的性能(站在客户端视角),一般适用于一些网页站点例如首页.H5的压测:而RPS(Requests per second)模式主要是为了方 ...

  3. Why failover-based implementations are not enough Redis分布式锁实现 SET resource_name my_random_value NX PX 30000

    核心 SET resource_name my_random_value NX PX 30000 Distributed locks with Redis – Redis https://redis. ...

  4. dotnet .NET

    小结: 1.一个.NET应用是一个使用.NET Framework类库来编写,并运行于公共语言运行时Common Language Runtime之上的应用程序.       Microsoft .N ...

  5. OPC UA 统一架构） (一)

    OPC UA 一 .OPC UA简介 OPC UA(OPC Unified Architecture)是下一代OPC统一体系架构,是一种基于服务的.跨越平台的解决方案. OPC UA具有如下特点: 1 ...

  6. 这些年来，一直不知道Code Fisrt的真实意义。

    目录 Code First 是一个糟糕的名字 放弃 EDMX,但继续实行数据库优先 Code First 是一个糟糕的名字 很多人依据它的名字认为,它是在代码定义模型,然后从模型生成数据库. Code ...

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

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

  8. OpenStack （glance 镜像服务）

    glance介绍 glance 提供云虚拟机上的服务镜像(Image)功能,该模块可看成车间里的模具生产部门,其功能包括虚拟机镜像的查找.注册和检索等.该模具最基本的使用方式就是在为云虚拟机实例提供安 ...

  9. 39.NFS（网络文件系统）

    要共享文件的主机都是Linux系统时推荐在客户端部署NFS 服务来共享文件. NFS(网络文件系统)服务可以将远程Linux 系统上的文件共享资源挂载到本地主机的目录上,从而使得本地主机(Linux ...

  10. jvm-本地方法接口

    什么是本地方法 简单地讲,一个Native Methodt是一个Java调用非Java代码的接囗.一个Native Method是这样一个Java方法:该方法的实现由非Java语言实现,比如C.这个特 ...