Percentage of height affects other sibling component's margin

[tkow]

• Review the documentation: https://facebook.github.io/react-native
• Search for existing issues: https://github.com/facebook/react-native/issues
• Use the latest React Native release: https://github.com/facebook/react-native/releases

Environment

React Native Environment Info:
System:
OS: macOS High Sierra 10.13.4
CPU: x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
Memory: 1.07 GB / 16.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 9.11.2 - ~/.anyenv/envs/ndenv/versions/v9.11.2/bin/node
npm: 5.6.0 - ~/.anyenv/envs/ndenv/versions/v9.11.2/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
Android SDK:
Build Tools: 23.0.1, 24.0.3, 25.0.0, 25.0.3, 26.0.0, 26.0.2, 27.0.1, 27.0.3
API Levels: 23, 25, 26, 27
IDEs:
Android Studio: 3.1 AI-173.4670197
Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
npmPackages:
react: 16.4.1 => 16.4.1
react-native: 0.56.0 => 0.56.0
npmGlobalPackages:
create-react-native-app: 1.0.0
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7

Description

Percentage height styled components affects their siblings.
see the below and demo.

Reproducible Demo

you can see that with change style of textContainer from percentage to arbitrary number

https://snack.expo.io/SyAPKCP8Q

[tkow]

this may be related to #19640

[react-native-bot]

Can you reproduce the issue on the latest release, v0.56?

[tkow]

@react-native-bot
I tried react-native 0.56 and this can be reproduced.

React Native Environment Info:
System:
OS: macOS High Sierra 10.13.4
CPU: x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
Memory: 1.07 GB / 16.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 9.11.2 - ~/.anyenv/envs/ndenv/versions/v9.11.2/bin/node
npm: 5.6.0 - ~/.anyenv/envs/ndenv/versions/v9.11.2/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
Android SDK:
Build Tools: 23.0.1, 24.0.3, 25.0.0, 25.0.3, 26.0.0, 26.0.2, 27.0.1, 27.0.3
API Levels: 23, 25, 26, 27
IDEs:
Android Studio: 3.1 AI-173.4670197
Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
npmPackages:
react: 16.4.1 => 16.4.1
react-native: 0.56.0 => 0.56.0
npmGlobalPackages:
create-react-native-app: 1.0.0
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7

percentage style

number style

[stale]

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.

[stale]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.