Datepicker and time selector sitting behind nav-tabs

Topic: Datepicker and time selector sitting behind nav-tabs

stu_pid pro asked 6 years ago

Hey - I'm trying to include a datepicker and time selector in a set of nav-tab panels. When you activate them they are both hidden behind the nav-tabs. I've tried maxing out the z-index but it has no effect Thanks

Add comment

Marta Wierzbicka staff answered 6 years ago

0 0 Best answer

Hi, add this code to your styles:

.tab-content {
z-index: unset;
}
.nav-tabs {
z-index: 1;
}

Best, Marta

Add comment

SL-Tech pro answered 6 years ago

0 0 Best answer

Please insert min. 20 characters.

Hi, I've the same question.

I've simply created a Tab's Selector, than in a Tab, I've put a DatePicker .
The DatePicker goes behind the head of Tab's Selector, and the Tab's Selector remain clickable.
It would be disabled by dark mask.

No CSS customization, only vanilla MDB

Screenshot no customization

Screenshot z-index:1 on Tab's Selector

With z-index:1 the content go over the the Tab's Selector, so we've to take another way

SL-Tech pro commented 6 years ago

I've used the https://mdbootstrap.com/components/tabs/#basic-example to build the tabs No problem with https://mdbootstrap.com/components/tabs/#classic-tabs

Add comment

Mikołaj Smoleński staff answered 6 years ago