I have a table with with children expanded row (The row with caret is parent row and below it are its children) like the image below:
In this image, the dots (regardless green or red) of parent rows and children rows are in ordered.
But, after navigating to a specific route (call it routeWithAnotherTable) on my React app and navigate back to this route, the table looks like this:
In the routeWithAnotherTable, I also have a table and I realize, after removing out the code for rendering table on that route, this weird bug is gone.
Hard for you guys to fix this for me but I need some kind of direction, instruction or any possible reasons (caching, browser or css behavior, etc.) for that bug.
Many thanks in advance.
UPDATE: I can fix my bug now but the reason why is still unobvious.
In the first load, my table takes effect from a css file but after navigating to routeWithAnotherTable and then navigating back it takes effect from another css file and the padding broke the order of dots.
