Container height problem

[thebarty]

Hi guys,

I have a problem with the container-height, where I am basically experiencing this issue here and get white-space under the footer (https://stackoverflow.com/questions/34188161/remove-white-space-below-footer)

When i enable isLazyMount the first step looks good, but after going to the next step the white-space appears.

Has anyone got the same problem and knows a solution?

[Nciso]

I have the same problem, but I don't have a solution, I don't have the isLazyMount activated

[thebarty]

I did NOT solve it but kind of made it less obvious by:

1) using css height: 100he on the wrapping container 2) switching animations to a different style

I basically still have the issue but the user only sees it when scrolling down

[segicm]

I had this problem, where the components with the larger height made the white space to the smaller components. The solution that worked for me was to set the non-active components to display: none; so the white space will not be shown. Here's how: .rsw_2f{ display: none; } .rsw_3G{ display: block; }

All step components will have the .rsw_2f class and only the active one will have the .rsw_3G class.

[eatoncw]

Ok, following on from @segicm - I was able to avoid this same container height (which resulted in long scrolling, white space) by add a min-height to .rsw_3g - eg:

.rsw_2f {
  display: none;
}
.rsw_3G {
  display: block;
  min-height: 100vh;
}

I had this issue with and without lazy loading, but this fixed it.

Please note this does change the transition though.

[halabe15]

Activating isLazyMount worked for me!!

[resolritter]

It doesn't seem to me that this concern would be solved by this library. Even if so, it's not actionable without a demo of the problem, anyway.

Closing due to unactionability.

[Bogdastotel]

I had this problem, where the components with the larger height made the white space to the smaller components. The solution that worked for me was to set the non-active components to display: none; so the white space will not be shown. Here's how: .rsw_2f{ display: none; } .rsw_3G{ display: block; }

All step components will have the .rsw_2f class and only the active one will have the .rsw_3G class.

@segicm thanks for the help! :)

[sasha-larson]

I also had this issue but was utilizing a form across the steps. I found that utilizing the isActive prop from step-wizard and hiding the step component when it's not active solved the issue

[jcarteaga1]

También tuve este problema, pero estaba usando un formulario en los pasos. Descubrí que utilizar el accesorio isActive del asistente de pasos y ocultar el componente de paso cuando no está activo resolvió el problema

Hello, can you show an example of how you solved it? i have the same error but nothing works for me