I am working on a hybrid mobile-app and one of the screens is having an issue where the height and width of a div element is being set to 0px causing the screen to not display as required.
Below is how the screen is expected to look like:
The issue is with the grid like div element in the middle. When this screen is displayed above as required, the height and width of this div is set to 500px and 358px respectively.
However, the issue is that when this screen loads for the first time, the screen is displayed as below:
As can be seen, the grid in the middle is not displayed.
The content-section div has width and height set to 0 pixels.
However if we select a different order (using the dropdown on the top), the screen is reloaded and displayed correctly as required (with height and width set to appropriate pixel values).
Now I am not looking for the exact answer to this issue (if somebody can give this, nothing like it) but I am trying to understand if you faced this issue, what would be the next step to follow. How can we identify the root cause behind the height and width getting set to 0 px the first time the screen is