After setting padding for the parent element, the absolute positioning of the child element is inaccurate

[ShaoGongBra]

Description

The child element is set to left: 0 and is positioned within the padding, which does not match the actual performance

Steps to reproduce

<View style={{padding: 20,height: 100, backgroundColor: '#f2f2f2'}}>
  <View  style={{height: 20, width: 20, backgroundColor: '#666', position: 'absolute', left: 20, top: 20}} />
</View>

React Native Version

0.71

Affected Platforms

Runtime - Android, Runtime - iOS

Areas

Fabric - The New Renderer

Output of npx react-native info

System:
    OS: Windows 11 10.0.22631
    CPU: (16) x64 Intel(R) Core(TM) i7-10700 CPU @ 2.90GHz
    Memory: 16.30 GB / 31.87 GB
  Binaries:
    Node: 18.19.0 - ~\AppData\Local\Temp\yarn--1709026031687-0.9586875619600348\node.CMD
    Yarn: 1.22.21 - ~\AppData\Local\Temp\yarn--1709026031687-0.9586875619600348\yarn.CMD
    npm: 10.2.3 - C:\Program Files\nodejs\npm.CMD
    Watchman: Not Found
  SDKs:
    Android SDK: Not Found
    Windows SDK:
      AllowDevelopmentWithoutDevLicense: Enabled
      AllowAllTrustedApps: Enabled
  IDEs:
    Android Studio: AI-223.8836.35.2231.11005911
    Visual Studio: 17.8.34322.80 (Visual Studio Community 2022)
  Languages:
    Java: 11.0.21
  npmPackages:
    @react-native-community/cli: Not Found
    react: ^18.2.0 => 18.2.0
    react-native: ~0.71.11 => 0.71.15
    react-native-windows: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

Stacktrace or Logs

no

Reproducer

no

Screenshots and Videos

No response

[github-actions]

⚠️	Add or Reformat Version Info
ℹ️	We could not find or parse the version number of React Native in your issue report. Please use the template, and report your version including major, minor, and patch numbers - e.g. 0.70.2

[github-actions]

⚠️	Missing Reproducible Example
ℹ️	We could not detect a reproducible example in your issue report. Please provide either: If your bug is UI related: a Snack If your bug is build/update related: use our Reproducer Template. A reproducer needs to be in a GitHub repository under your username.

[ShaoGongBra]

Did the updated version fix this issue, or did it only occur in certain specific situations? I cannot reproduce it using this example now, but I did encounter this issue before going there

[cortinico]

Is this New Architecture specific? Have you tried on the Old Architecture?

[ShaoGongBra]

@cortinico I am certain that this problem is encountered on the new architecture. When I encounter it again, I will put the example up. I feel that it only appears under certain specific conditions

[NickGerleman]

Correct behavior is to treat containing block as padding box of parent, so adding padding should not change position of child.

@joevilches is this in the list of things we fixed under strict layout conformance mode/Yoga without errata?

Note that we likely would not be able to fix this issue more globally for existing components because it could break existing layouts. But we are building out conformance in the longer term, and plan to eventually expose the ability to control legacy vs conformant layout on subtree basis.

[joevilches]

@NickGerleman Yes this situation is covered in those list of things, specifically in #41684. Although the fix in there was more about the priority of insets in the case both left and right are defined (among other things). I do not recall this specific situation being broken and it seems like it should be working based on the legacy positioning logic. I was not able to repro either with the strict layout conformance off.

[cortinico]

When I encounter it again, I will put the example up. I feel that it only appears under certain specific conditions

Closing as we cannot reproduce + for the reasons mentioned by @joevilches. If you can consistently reproduce, please open a new issue. Plus ideally try on the latest stable (0.73) as it would help us investigate/fix