maxWidth and maxHeight not respected when padding in one of the axiz exceeds the max values #1796

Open
opened 2025-03-06 23:48:30 -08:00 by craig006 · 1 comment
craig006 commented 2025-03-06 23:48:30 -08:00 (Migrated from github.com)

To reproduce the issue, make a single root container with these two properties set:
maxWidth: 10
paddingLeft: 100

Expected result:
The maxWidth of the container is respected and the container has a total width of 10.

Actual:
The maxWidth of the container is not respected and the container has a total width of 100.

Here is a link to a playground with the example

To reproduce the issue, make a single root container with these two properties set: `maxWidth: 10` `paddingLeft: 100` Expected result: The maxWidth of the container is respected and the container has a total width of 10. Actual: The maxWidth of the container is not respected and the container has a total width of 100. [Here is a link to a playground with the example](https://www.yogalayout.dev/playground?code=DwGQhgng9grgLgAgMZQHYDMCWBzAvAb3xgGcBTAdVICMARU9MGAGzmIC4EGmyBfHgPgBQCBMAByUACalhIhMTgQmpAvllyEAWzAAPcpklwAFhwCsABgA06uQAcwkyZlTYQ9OBwCM5qzZFHSHCMPBG9fDT4hEWAAeglpIVjwaHh+IA)
Wiksnet commented 2025-06-25 23:55:50 -07:00 (Migrated from github.com)

I also encountered a perhaps a similar problem. It may be related. If the parent size is roughly the same as the total size of all the Child, then the child gets a width: 0. But if you make the window smaller or larger, they appear again.

Link to playground

There seems to be no problem if all the children are the same size. But I deliberately set the first one to 60px and the others to 64px

Image
Image
Image
Image

I also encountered a perhaps a similar problem. It may be related. If the parent size is roughly the same as the total size of all the Child, then the child gets a width: 0. But if you make the window smaller or larger, they appear again. [Link to playground](https://www.yogalayout.dev/playground?code=DwGQhgng9grgLgAgMZQHYDMCWBzAvAb3xgGcBTAdVICMARU9MGAGzmIC4EGmyBfHgPgBQCBMAByUACakExOBCakC+AO6ZJcABYcAzAFYADABoEm0jk1wOADkMmADmEmTMqbB2MJhIn+kUAPGkwAJ1IkOEw0DgByFCZoviEfH28RAHo0hABRfzAAW3tFBDUtBDAEKhh3VNEJaVl5RWU1DW0EfU8zCyt2uwRHZ1d3BAAmTxrkv1JAkLCIqIRo4KgVBIEJ2qkZOQUlQin-DgBGEzywf3J1LQ4ANgM+BDSk5M36nab9gOPT88vW24ALA8nhtxFsGrtlAdvggzhcrm0bkCeI9nskwW9Gnt8NCECdYb8EYDgWifBjtlioV88T94f8EEiSTVgGk6qRSTUMtlcgUiipNJgkJpilBggBrYicVykAB0nMyMsVCAAQvAEHBghB1VAEK4kKEwGRigi5ckuYqZQgAMqkRAdTii3WoORgVBIWVedFsiEfVRE9oGTrmbCWXR9AYuNwcMYmDYiA5BULhSKoGLLVaJUHe97Y3H4uF-a4M+4okEvV4UyGfaYwgv+xml0kick+3PU-OE+kN1FZ8E5qk1mkEulF7tll4t-vVw5Dutd5E99GsrYc5vL6RCFngaDwfhAA) There seems to be no problem if all the children are the same size. But I deliberately set the first one to 60px and the others to 64px ![Image](https://github.com/user-attachments/assets/52c5e1a4-1593-40b0-8b43-e151a51e6b6d) ![Image](https://github.com/user-attachments/assets/7134d233-08b3-44ca-8559-9cf22eab8f88) ![Image](https://github.com/user-attachments/assets/e5dea45b-f36c-4fa0-bec8-5f33b011692c) ![Image](https://github.com/user-attachments/assets/074bab59-74a7-4ac3-bce6-6cb571596b2c)
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: DaddyFrosty/yoga#1796
No description provided.