Issue in applying css on lightning:tab in Aura

Question

I want to apply custom CSS on lightning:tab of lightning:tabset I tried using inline CSS, external CSS but there is no luck, I want a way to check below:

(Used to create tab section which is highlighted)

.THIS li:nth-child(2) {
    background-color: dodgerblue !important;
    color: white !important;
    height:1.5rem;
    cursor: no-drop !important;
    pointer-events: none;
    
}
.THIS li:nth-child(7) {
    background-color: dodgerblue !important;
    color: white !important;
    height:1.5rem;
    cursor: no-drop !important;
    pointer-events: none;
}

.THIS li:nth-child(12) {
    background-color: dodgerblue !important;
    color: white !important;
    height:1.5rem;
    cursor: no-drop !important;
    pointer-events: none;
}
.THIS li:nth-child(15) {
    background-color: dodgerblue !important;
    color: white !important;
    height:1.5rem;
    cursor: no-drop !important;
    pointer-events: none;
}

This worked, anyhow I need some other solution as I am getting tabs dynamically there can be "n" number of tabs. and updating the CSS on every tab insertion/deletion is Misery!

Please let me know if anyone has any solution

Many thanks in advance!

Mostafa Mohammadzadeh · Accepted Answer · 2021-11-27 12:23:34Z

0

If you have to use !important in your CSS, maybe your .css files are included in the wrong order. check the element/style section in your browser's developer tools and find the files that are overriding the style of your tables.

answered Nov 27, 2021 at 12:23

Mostafa Mohammadzadeh

92112 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

sfdc dev Over a year ago

I checked there is no other style overriding the custom Css.

Mostafa Mohammadzadeh Over a year ago

It's strange, can you see your custom style in dev tools? maybe your style isn't targeting the HTML tags. Share a screenshot or something.

Collectives™ on Stack Overflow

Issue in applying css on lightning:tab in Aura

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related