Css 并排的盒子占50%，但想把固定大小的盒子放在每个盒子的中心吗？

我试着做的是有两个盒子，并排放置，每个盒子保持50%的屏幕宽度，这样不管屏幕宽度如何，它们都保持50%

但是，我也尝试将文本框放在每个框中，但我希望内部框完全居中，并保持固定的宽度，以便文本不会随着屏幕宽度的变化而移动

---

有人有什么想法吗？看起来很简单，但我才刚刚开始使用CSS，请耐心等待。

您可以这样使用CSS：

   .half-screen{
       box-sizing: border-box;
       display: inline-block;
       width: 50%
    }

然后你在盒子里做你的逻辑

请注意，您可以使用

垂直对齐：top如果您希望它们并排并具有相同的起点

#sides {
padding-top: 40px;
padding-bottom: 40px;
background-color: white;
}

#leftside {
width: 50%;
background-color: grey;
padding: 20px;
margin: 0px;
position: relative;
}

#rightside {
width: 50%;
display: inline-table;
background-color: #018DCA;
float: left;
padding: 20px;
margin-left: 50%;
position: relative;
}

。
.


文本

文本


文本

文本


两个并排盒子中间的固定尺寸：


.container{
高度：200px；
宽度：300px；
背景颜色：浅灰色；
字号：0；
}
.盒子{
显示：内联块；
宽度：50%；
身高：100%；
背景色：淡蓝色；
位置：相对位置；
边框：实心1px#222；
框大小：边框框；
}
.子框{
身高：50%；
宽度：50%；
转换：翻译（-50%，-50%）；
最高：50%；
左：50%；
位置：绝对位置；
背景色：印度红；
}

欢迎使用堆栈溢出！寻求调试帮助的问题（“为什么这段代码不起作用？”）必须包括所需的行为、特定的问题或错误以及在问题本身中重现它所需的最短代码。看，哇…谢谢！伙计，我还有很多东西要学…神圣的烟。我感谢你的帮助！好吧…现在我有另一个问题…也许你能帮上忙。我在每个子框中输入长度不均匀的文本；让我们在一个盒子里说一个句子，在另一个盒子里说一个段落。我希望box1和box2都垂直拉伸以容纳较长的文本，以便这些框保持相同的长度。这有意义吗？@DrewK–这里已经有了答案：
<div id="sides">
<div id="leftside">
<h1>text</h1>
<p>
<h2>text</h2>
<br>
</div>
<div id="rightside">
<h1>text</h1>
<p>
<h2>text</h2>
<br>
</div>
</div>