microsoft / microsoft/react-native-windows
[Fabric] Fix clipping on nested Views inside a text
Open
@Nitin-100 is already working on this.
Since Sep 11, 2025.
Area: Fabric
Area: Layout
Area: Text
enhancement
New Architecture
Workstream: Component Parity
- Dominant language
- C++
- Stars
- 17.3k
- Forks
- 1.2k
- Avg merge
- 1d 13h
- Merged PRs (30d)
- 33
Description
Summary
Clipping doesn't work for nested Views inside a text. The first view will be clipped correctly but any view inside of it will stay it's original width/height
Example Code
Can see that in RNTester that the Red View will be clipped correctly but the steelblue view won't
<RNTesterText
style={{
overflow: 'hidden',
width: 150,
height: 75,
backgroundColor: 'lightgrey',
}}>
This is an inline view
{/* Render a red border around the steelblue rectangle to make it clear how the inline view is being clipped */}
<View style={{width: 50, height: 100, backgroundColor: 'red'}}>
<View
style={{
width: 48,
height: 98,
left: 1,
top: 1,
backgroundColor: 'steelblue',
}}
/>
</View>
</RNTesterText>
Basic Example
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Assessment
This issue has not been assessed yet.