【BUG日记】【CSS】top和bottom、left和right同时存在的时候,left、top优先级最高(无论class、style、!import)

简介: 【BUG日记】【CSS】top和bottom、left和right同时存在的时候,left、top优先级最高(无论class、style、!import)

【日期】


2022/3/18


【问题】


今天在实现项目功能的时候,发现top和bottom如果同时存在,不管top和bottom位置放在哪里的样式,top一直都比bottom的优先级高,left和right同时存在的时候也是一样,left一直会比right的优先级高。然后就导致功能失效。


「存在问题Demo的展示」


微信截图_20220520115113.png


「需要做到Demo的展示」


微信截图_20220520115123.png

【原因】


top和bottom、left和right同时存在的时候,left、top优先级最高(无论class、style、!import)


【如何发现】


想要完善实现功能的时候,发现的,这个可真是狠啊!


【如何修复】


细心的朋友可能看到了,在想要做到的demo展示图里,只需要对top、left添加上auto即可解决问题!


(ps:大佬指点,感谢春哥(摸鱼的春哥),yyds!)


【总结】


遇到凡事不要慌,先去问问大佬(春哥).


文章小尾巴


文章写作、模板、文章小尾巴可参考:《写作“小心思”》


  感谢你看到最后,最后再说两点~


  ①如果你持有不同的看法,欢迎你在文章下方进行留言、评论。

  ②如果对你有帮助,或者你认可的话,欢迎给个小点赞,支持一下~


  我是南方者,一个热爱计算机更热爱祖国的南方人。


  (文章内容仅供学习参考,如有侵权,非常抱歉,请立即联系作者删除。)



目录
相关文章
|
2月前
|
前端开发 算法
CSS语言的层叠和优先级
CSS语言的层叠和优先级
|
2月前
|
前端开发 算法
CSS 选择器的优先级算法
在CSS中,选择器的优先级由四个级别和各级别的出现次数决定**。这四个级别分别为:行内选择符、ID选择符、类别选择符、元素选择符,优先级依次降低。
|
5月前
|
人工智能 前端开发 Cloud Native
css选择器有哪些?优先级?哪些属性可以继承?
css选择器有哪些?优先级?哪些属性可以继承?
|
7月前
|
Web App开发 前端开发 开发者
|
8月前
|
XML 前端开发 数据格式
CSS引入方式这么多是什么优先级?
CSS引入方式这么多是什么优先级?
52 0
|
14天前
|
前端开发
css的选择器,优先级和示例
css的选择器,优先级和示例
9 1
|
4月前
|
XML 前端开发 UED
提升代码质量:如何遵循 CSS 优先级和最佳实践
提升代码质量:如何遵循 CSS 优先级和最佳实践
|
4月前
|
前端开发 程序员 容器
CSS样式文件和class类名命名规范参考
CSS样式文件和class类名命名规范参考
28 0
|
9月前
|
前端开发
【css选择器有哪些?优先级?哪些属性可以继承?】
【css选择器有哪些?优先级?哪些属性可以继承?】
|
5月前
|
前端开发 算法
css 选择器有哪些?优先级?哪些属性可以继承?
css 选择器有哪些?优先级?哪些属性可以继承?
29 0