水平对齐最后 2 级嵌套 div

Question

我正在尝试覆盖软件生成的 HTML。 我无法更改 HTML，但是该软件能够添加内联 CSS。这些是彼此嵌套的块。

<div id='A'> DIV A
  <div id='B'> DIV B
    <div id='C'> DIV C
    </div>
  </div>
</div>

这里A>B>C。 我试过添加

#A > div {display:inline-blocks;} 

&

#A {
display: flex;
flex-direction: row; }

但不知何故，DIV C 始终低于 DIV B，因为它在 DIV B 下编码。无论如何，我可以覆盖 CSS。我正在寻找的 output 如下所示，DIV B 和 DIV C 水平对齐，不应重叠不同屏幕尺寸

Answer 1

使用 css 做到这一点的唯一方法是在 div 上使用 position absolute 并覆盖您可以使用的特定内容。重要。

div a{
 position: relative;
 padding:0 15px;
}

div b {
 witdh:20%
}

div c{
 position: absolute;
 width:70%;
 bottom:0;
 right:15px;
}

一旦我们使用百分比大小，此代码将适用于某些分辨率，但您需要检查它们并在需要时改进代码。

也可以选择显示无 div c 并在 div b 之外用 Js 重新创建它。