css flex 实现布局，子元素左右两列横向布局，做列固定宽度200px,右侧 1200px, 右侧内容超出宽度 出横向滚动条。

你可以使用 CSS Flexbox 来实现这种布局。下面是一个简单的示例代码：

PS：flex-shrink: 0

flex-shrink 是 CSS Flexbox 布局中的一个属性，用于指定项目在必要时是否收缩。

当容器空间不足时，flex-shrink 属性决定了 Flexbox 项目相对于其它项目的收缩比例。默认情况下，项目都可以收缩（flex-shrink: 1），这意味着当容器空间不足时，项目会根据自身的 flex-shrink 值进行收缩，以适应剩余空间。

而当你将 flex-shrink 设置为 0 时，这意味着该项目不会收缩，即使容器空间不足，也不会将其缩小以适应剩余空间。

例如，如果你有两个项目，一个设置了 flex-shrink: 0，另一个设置了 flex-shrink: 1，当容器空间不足时，具有 flex-shrink: 1 的项目会优先收缩，而具有 flex-shrink: 0 的项目将保持其原始大小。