Html Div表不工作

所以我试着把两个文本区域放在一起，我试着用div表，但是表和它的部分被推到了左上角，我做错了什么？有更好的方法吗

迷路的
* {
填充：0px；
边际：0px；
边框：1px纯白；
}
身体{
背景：黑色；
}
文本区{
边框：1px纯白；
背景：黑色；
宽度：50%；
高度：500px；
}
#桌子{
显示：表格；
宽度：自动；
}
#tr{
显示：表格行；
宽度：自动；
}
#tc{
显示：表格列；
宽度：50%
}

您可以（更好）使用

flexbox

解决此问题。只需几行代码，就可以解决语义正确的实现问题：

.box {
  width: 100%;
  display: flex;
  flex-flow: row wrap;
}

.box-textarea {
  flex: 0 0 50%;
}

阅读更多有关的信息。
另外，请确保已添加

框大小：边框框到您的代码，否则由于边界的原因，宽度将为
100%+1px



迷路的
* {
填充：0px；
边际：0px；
边框：1px纯白；
框大小：边框框；
}
身体{
背景：黑色；
}
文本区{
边框：1px纯白；
背景：黑色；
宽度：100%；
高度：500px；
}
.盒子{
宽度：100%；
显示器：flex；
柔性流：行换行；
}
.box文本区{
弹性：0.50%；
}
您当然可以按照@Roy的建议使用Flexbox

“显示：表格列”不提供制作专栏布局的机制（例如，具有多个专栏的报纸页面，其中内容可以从一个专栏流向下一个专栏）

相反，“表列”只设置应用于表行中相应单元格的属性

如果您希望使用“表格单元格”，请使用“表格单元格”




迷路的
* {
填充：0px；
边际：0px；
边框：1px纯白；
}
身体{
背景：黑色；
}
文本区{
边框：1px纯白；
背景：黑色；
高度：500px；
}
#桌子{
显示：表格；
}
#tr{
显示：表格行；
}
#tc{
显示：表格单元格；
宽度：50%
}
为什么不使用
？好的，很好，谢谢你的帮助noob@DavidAngulo因为这在语义上是不正确的