Html 相同高度容器的宽度问题

我的目标是有两个容器，每个容器的宽度为50%，如果其中一个容器中的文本量大于另一个容器中的文本量，那么这两个容器的高度都与文本较长的容器相同。你能告诉我为什么我的代码中没有应用50%的宽度吗

css: .包装容器{ 填充：32px； }

HTML:

数字基础设施

同样的道理，也有类似的争论，但事实上是这样的。提比克
percipitur ex vim，vim id idque soleat tibique，拥有完整的学说。

为您编辑的代码：

.wrapper-container{
  padding: 32px;
}

.display__table {
  width: 100%;
  display: table;
}

.display-table__row{
  display: flex;
  //margin:0 -0.9375rem;
}

.themeTile{
  display: table-cell;
  position: relative;
  float: none;
  border-bottom: 1px solid gray;
  width: calc(50% - 2rem);
 // width:50%;
  // padding-left: 0.9375rem;
 //   padding-right: 0.9375rem;
}

.themeTile:nth-child(odd){
    //padding-right: 2rem;
}


.themeTextContainerWide{
  width: calc(100% - 90px);
  float: left;
}

.themeTextContainer{
  width: calc(100% - 280px);
  float: left;
}

.theme-image-container{
  width: 280px;
  float: left;
  position: relative;
}

为您编辑的代码：

.wrapper-container{
  padding: 32px;
}

.display__table {
  width: 100%;
  display: table;
}

.display-table__row{
  display: flex;
  //margin:0 -0.9375rem;
}

.themeTile{
  display: table-cell;
  position: relative;
  float: none;
  border-bottom: 1px solid gray;
  width: calc(50% - 2rem);
 // width:50%;
  // padding-left: 0.9375rem;
 //   padding-right: 0.9375rem;
}

.themeTile:nth-child(odd){
    //padding-right: 2rem;
}


.themeTextContainerWide{
  width: calc(100% - 90px);
  float: left;
}

.themeTextContainer{
  width: calc(100% - 280px);
  float: left;
}

.theme-image-container{
  width: 280px;
  float: left;
  position: relative;
}

替换：

.display-table__row{
    display: table-row;
}

与：

那么你的宽度就很好了
 替换：

.display-table__row{
    display: table-row;
}

与：

那么你的宽度就很好了
 更改了父类的
显示
选择器

.display-table__row{
 display: -ms-flexbox;
 display: -webkit-flex;
}

这是工作
更改了父类的
显示
选择器

.display-table__row{
 display: -ms-flexbox;
 display: -webkit-flex;
}

这是正在工作的
没有工作。我将您建议的更改应用于代码笔，但仍不应用50%的宽度某些浏览器不支持宽度的calc（）函数。我有你的代码这里是jsfiddle链接：我想知道它如何计算宽度：calc（100%-280px）；但不计算宽度：计算（50%-2rem）；没用。我将您建议的更改应用于代码笔，但仍不应用50%的宽度某些浏览器不支持宽度的calc（）函数。我有你的代码这里是jsfiddle链接：我想知道它如何计算宽度：calc（100%-280px）；但不计算宽度：计算（50%-2rem）；编辑了答案。请检查一下。很抱歉，我没有在我的电脑中安装IE11，无法找到答案。请检查一下。很抱歉，我的Mac电脑中没有安装IE11。我正在尝试为容器设置边框底部，而且我需要在单元格之间留出一些空间。我添加了一个单元格包装器，但问题是它将内容从底部对齐，因此在顶部有一个空格，而不是在底部添加空格。我更新了代码笔，你有什么解决办法吗？我正在尝试为容器设置一个边框底部，并且我需要在单元格之间留出一些空间。我添加了一个单元格包装器，但问题是它将内容从底部对齐，因此在顶部有一个空格，而不是在底部添加空格。我更新了密码笔你有什么解决办法吗？