Element: [Bug Report] in table, when row-class-name is used with stripe, rows with stripe do not display the background color of row-class-name
Element UI version
1.4.2
OS/Browsers version
macOS 10.12.6 / chrome 61.0.3163.79
Vue version
2.3.3
Reproduction Link
https://jsfiddle.net/tangdaohai/wunu0rka/
Steps to reproduce
进入jsfiddle，点击下一行、上一行 切换高亮。 当高亮的行数是stripe时，stripe的背景色是写在子元素里面的，将外层背景色覆盖了
What is Expected?
高亮的背景色优先级最高
What is actually happening?
stripe的背景色覆盖了高亮行数的背景色
tangdaohai
All 4 comments
Translation of this issue:
Element UI version
1.4.2
OS/Browsers version
MacOS 10.12.6 / Chrome 61.0.3163.79
Vue version
2.3.3
Reproduction Link
https://jsfiddle.net/tangdaohai/wunu0rka/
Steps to reproduce
Go to jsfiddle, click on the next line, and switch up the highlight on the previous line. When the number of lines highlighted is stripe, the background color of the stripe is written inside the child element, and the outer background color is covered
What is Expected?
Highlight the background color with the highest priority
What is actually happening?
The background color of the stripe covers the background color of the highlighted lines
element-bot
on 13 Sep 2017
I try set 'td' CSS can Solve the problem
.el-table .disabled-row {
background: #f7c542;
}
.el-table .disabled-row td {
background: #f7c542 !important;
}
KDJack
on 13 Sep 2017
是的，加 !important 吧，即使 stripe 的背景色没有写在子元素里，由于嵌套层级比较多，选择器的优先级还是会覆盖掉 .el-table .info-row
https://jsfiddle.net/wunu0rka/2/
Leopoldthecoder
on 13 Sep 2017
@KDJack @Leopoldthecoder 这似乎也是一个好主意。。。
tangdaohai
on 13 Sep 2017
Related issues
PanJiaChen
·
3Comments
Kingwl
·
3Comments
akaylh
·
3Comments
sudo-suhas
·
3Comments
yubo111
·
3Comments
Most helpful comment
I try set 'td' CSS can Solve the problem
.el-table .disabled-row {
background: #f7c542;
}
.el-table .disabled-row td {
background: #f7c542 !important;
}