边框或圆角被背景颜色挡住的解决方案


6.5日更新

之前傻了,哪有那么复杂,直接加个overflow:hidden;就行了,auto还会导致滚动条,多low哦

问题描述

记录一个工作中遇到的问题,给外层div设置了边框,但是里面内容如果宽度100%,然后有背景,就被挡住了。如下图:
边框被挡住

使用过的方法

1.于是我设置margin-left: 0.5px;,左侧是不被挡住了,但是有些地方下面被挡住,而且圆角也被挡住,行不通。
2.我又使用伪元素:after,宽高100%定位画一个边框,结果发现里面的内容被这个挡住了,点不了东西
3.最终,加上overflow: auto, 完美解决。

overflow属性规定当内容溢出元素框时发生的事情

后记

以前从来没注意这个,在这个问题里,却立了大功。


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM