NG-ZORRO / ng-zorro-antd

Angular UI Component Library based on Ant Design
https://ng.ant.design
MIT License
8.85k stars 3.9k forks source link

nz-carousel height no longer responsive #8572

Open strybol-nicolas opened 3 months ago

strybol-nicolas commented 3 months ago

Reproduction link

https://stackblitz.com/edit/ng-zorro-antd-ivy-w2drwm?file=src%2Fapp%2Fapp.component.html

Steps to reproduce

On load the issue is already present, the "previous" and "next" buttons get pushed further down than should be. (As seen by the 2px wide red border.

When pressing on the "toggle" button situated at the top of the page, we see a shift of the buttons when the nz-carousel component gets destroyed. Pressing it once more, makes it reappear in the correct dimensions.

But in either case, vertical responsiveness is not working and the nz-carousel does not change height.

What is expected?

nz-carousel 's vertical responsiveness is intact and follows along when resizing the window

What is actually happening?

nz-carousel exceeds the allotted space, causing elements to not be situated correctly.

Environment Info
ng-zorro-antd 17.4.1
Browser Chrome

I've been struggling to get this issue fixed for a few days now and am out of ideas or way to fix it, I apologise for any inconvenience

strybol-nicolas commented 1 month ago

Update:

I seem to have found the issue (After a long vacation).

It would seem nz-carousel does NOT work well with the basic HTML button (And possibly other elements?) :

Browser : (Without button) image

Bowser : (With button) image

And here is the wonderfully detailed HTML : image

Am going to try and find an alternative because it is rather inconvenient.

EDIT: Many other elements cause this issue. Even a simple paragraph element causes the height to be wrong.