Ant Design 布局组件

【问题标题】：Ant Design Layout ComponentAnt Design 布局组件
【发布时间】：2019-11-20 19:56:10
【问题描述】：

我在一个 react 项目中有一个非常基本的 ant 设计实现。我使用了create-react-app，并完成了 antd 文档中详述的建议步骤。

我遇到的问题是调整Layout 组件的Content 部分的大小。目前，即使我的 Dragger 组件包含在 Content 组件中，它也出现在它的下方。 Content 组件由屏幕上的灰色区域表示。尝试使用样式调整它的大小并没有产生预期的结果。

这里是code pen。我只是想确保上传框位于内容部分内，而不是在其下方。

任何帮助都会很棒！

【问题讨论】：

【解决方案1】：

您已将 Dragger 组件包装在一个位于主体中心的 absolutely positioned 的 div 中，因此它忽略了常规内容流。如果您删除该内联 CSS，它将按照您的预期运行。

【讨论】：

是的，我想把它放在那里，就在内容部分？是否有正确的方法来执行此操作，以便我可以将布局的整个内容部分向下拖动。我正在尝试为每个页面创建一个静态布局并呈现不同的内容
只需从容器 div 中移除 style 属性。
是的，我做到了——这是一个新的codepen。这基本上只是将所有内容都撞到了顶部，这是不需要的。我希望内容部分占用大约 80% 的屏幕，无论其中是否实际上有任何内容，并且页眉和页脚部分包含剩余的 20%
它在内容 div 中。您到底想要完成什么？如果您想要不同的样式，则必须添加它们。
我会调查viewport units。