-
Notifications
You must be signed in to change notification settings - Fork 4.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Tabs tab indicator missing on load #2102
Comments
I have the same problem. ~since Chrome 44 (didn't use tabs on older Chrome,46 currently) |
It also fails on OS X Firefox 41.0.2 and Safari 9.0.1 I dont think its a browser issue. |
I have the same problem! Is there any fix for this? |
This issue is hard to reproduce |
@chifreaigle I have a tab somewhere inside another (main) tab, maybe that helps? Also, the class "active" is correctly set. Only |
@loolooii Yeah,i got the steps to reproduce the issue, when making a tab(secondary tab) inside an other tab(main tab) makes the indicator of the secondary tab invisible, as @joxmar said the only way to get it showing is by either resizing or selecting the tab,Here is an example |
Just got the same issue. Tab indicator not showing, only after resizing the window. Is there any workaround or solution meanwhile? |
@julianctni for a quick fix, you could: At the end of your event handler for $(document).ready, add the following: |
I can't do that because my tabs are in a modal. It makes the indicator the entire width of the tabs. (underlines all tabs end to end) |
Nevermind, I just put @adamhammond 's one-liner in the modal::ready callback |
I had the same issue, also with the tabs in a modal, the solution I used was: |
If you are using tabs inside "collapsible" elements, you must apply @adamhammond fix inside "onOpen" event, like this: $('.collapsible').collapsible({
onOpen: function(el) {
// https://github.com/Dogfalo/materialize/issues/2102
window.dispatchEvent(new Event('resize'));
}
}); |
* Fixed overlay on mobile menu. Materialize isn't clear on navbar mobile location, but some bug reading shows that it should be moved out of the div and place it as its own entity. See: Dogfalo/materialize#2879 * Fixed mobile menu width. See: Dogfalo/materialize#2102 * Merge downloads pages and instead add a sub-tab for stable releases. (This required some quirky workarounds for tab behavior... see: Dogfalo/materialize#2102) * Subtab support also forces a special CSS class to workaround issues in Materialize. (Talk about buggy...) See: Dogfalo/materialize#4029
This worked for me. |
This worked for me, i'm using angular 6, this tab not work with route-outlet.. thanks |
I'm having issues with the tabs, the tab indicator is missing when the tabs are loaded, The first tab is the default and the tab text is colored as selected tab and displaying the correct content but the indicator is missing. There's only 2 ways to get the indicator to show:
this is what I have:
The text was updated successfully, but these errors were encountered: