If a parent component has a fixed size but the child has a style of flex: 1 without explicit dimensions, the child might collapse to 0 height or width.
Acts as the parent container for the nested blocks. It has fixed dimensions and sets flexDirection: 'row' to place the two inner boxes side-by-side. 2.3.9 nested views codehs
Demonstrates the deepest level of nesting. It inherits its layout behavior directly from its parent ( innerBoxOne ). Common Pitfalls and How to Fix Them If a parent component has a fixed size
The top-level View uses flex: 1 to fill the entire device screen. It centers its contents using alignItems: 'center' and justifyContent: 'center' . Demonstrates the deepest level of nesting
Aligns items to the start or end edge. Code Structure for Exercise 2.3.9
Distributes items with equal space around each item. 3. alignItems
The CodeHS introduces foundational UI/UX concepts using React Native. Within this curriculum, Exercise 2.3.9: Nested Views is a key milestone for mastering component layout, Flexbox properties, and nested hierarchies. Core Concepts of Nested Views