如果没有网格，如何制作L型css布局？

我使用react native，希望制作一个布局，看起来像下图，两个div大小相等，直到右div结束，然后左div占据整个容器。我想我可以在网格中完成这项工作，但react native不支持网格，所以我不能使用它。我还有别的方法可以做到这一点吗？（对不起，我的绘画技巧太草率了）

这是有问题的代码，我希望在希伯来视图完成后，英语视图占据整个宽度

<ScrollView>
        <View style={styles.textContainer}>
            <View style={{flex: 1}}>
                <Text>
                    {props.english}
                </Text>
            </View>
            <View style={{flex: 1}}>
                <Text>
                    {props.hebrew}
                </Text>
            </View>
        </View>
    </ScrollView>

{props.english}
{props.hebrew}

一个选项是使用flexbox

import * as React from 'react';
import { Text, View } from 'react-native';

export default function App() {
  return (
    <View style={{flex: 1}}>
    <View style={{ flexDirection: 'row'}}>
      <View style={{flex:1, backgroundColor: 'red'}}>
      </View>
      <View style={{flex:1, backgroundColor: 'blue'}}>
        <Text>Suspendisse sed consequat mi. Ut commodo felis nec venenatis consectetur. Integer fringilla ipsum at magna iaculis, nec sollicitudin nunc mollis. Fusce eu vehicula nunc. Sed lorem est, viverra quis condimentum vel, volutpat vitae diam. </Text>
      </View>
    </View>
    <View style={{ flexDirection: 'row', flex: 1}}>
      <View style={{flex:1, backgroundColor: 'red'}}>
      </View>
    </View>
    </View>
  );
}

import*as React from'React'；
从“react native”导入{Text，View}；
导出默认函数App（）{
返回(
这是一种由威尼斯人饲养的普通猫科动物的悬浮液，它是一种在大沼泽地上生长的整株轮缘植物，它是一种在沼泽地上生长的植物。
);
}

---

请看一看即使使用Css网格也不可能。所有html元素都是矩形的。这不起作用，因为它们是三个不同的视图。我需要两个视图，但一个在另一个完成后占据整个宽度