css - 在多个“内联”div 中显示“块”div

Question

下图可以更好地理解我的问题。

我有几个 div 元素（div A），它们的大小取决于它们的内容。它们在一个较大的容器内显示在一个较大的容器中，其中定义了 max-with（没有名称的大外部矩形）。一切正常，直到我在 div A 内有另外两个 div（B 和 C），我看起来像图像。

我没有成功。我尝试了几种 CSS 属性的组合，如显示、边距、填充、浮动......负边距......表格......

欢迎任何帮助。

---

更新

代码类似于示例：

html

 <div style="max-width: 800px;">
    <div class="div_a">
      <div class="div_b">
        short text
      </div>
      <div class="div_c">
        short text
      </div>
    </div>

    <div class="div_a">
      <div class="div_b">
        looooong text
      </div>
      <div class="div_c">
        looooong text
      </div>
    </div>

    <div class="div_a">
      <div class="div_b">
        huuuuuge text
      </div>
      <div class="div_c">
        huuuuuge text
      </div>
    </div>
</div>

css

.div_a{
  display: inline;
}

.div_b{
  display: block; /* doesn't work*/
}

.div_c{
  display: block; /* doesn't work*/
}

Answer 1

如果我理解正确，应该这样做：

.div_a{
  display: inline-block;
}

:)

...假设您没有其他样式，除了边框和间距属性。

这里有一个小提琴示例