Question

目前处理一个有趣的问题，我有当前的html结构：

<div class='parents-parent'>
    <div class='parent'>
        <div style='width: 50%'></div>
    </div>

    <div class='parent'>
        <div style='width: 25%'></div>
    </div>

    <div class='parent'>
        <div style='width: 25%'></div>
    </div>
</div>

通过Angular UI路由器填充父div，并且每个视图/部分具有它自己的独立宽度。父母＆＃39; divs纯粹作为一个动态容器，所以它们没有设置宽度，因为这是由孩子控制的。但是，由于这个原因，百分比宽度对子元素不起作用。

是否可以允许子元素具有父母 - 父母的百分比宽度＆＃39; DIV？

Answer 1

样式不会影响元素或其子元素以外的任何元素。目前没有选择器允许修改父元素。

Answer 2

我通过尝试找到了一个解决方案，但它涉及 not 在代码中的DIV元素之间有任何空格或换行符（即* * *行中的整个HTML代码）：Make {{1内联元素和父元素内联块。它不完全符合逻辑，它可能不适用于所有浏览器，但至少在这里（在Firefox Mac上）它可以工作......

parent

html,
body {
  margin: 0;
}
.parent {
  display: inline;
}
.parent>div {
  display: inline-block;
}

Div为父母的父母百分比宽度。

2 个答案: