Question

如果父类中包含的子元素与父元素的宽度不同，那么它是如何可能的 1）孩子的宽度是100％ 2）孩子的宽度是'继承'？

这两件事都发生在我身上。当我处理一个巨大的页面时，很难把一个快速的小提琴放在一起。

Answer 1

inherit不一定继承父级的实际宽度（以像素为单位）对于width:100%，当父级有填充时，子级的宽度看起来可能比父级的宽度小。

＆＃13;

div.parent {
  background:yellow; color:brown;
  padding:0 1em;
  width:20em;
}

div.child {
  background:brown; color:yellow;
  width:100%;
}

＆＃13;

<div class="parent">
  This is the parent
  <div class="child">
    This is the child
  </div>
</div>

＆＃13;

如果包含width:auto的阻止父级的内联阻止子级为width:inherit，则子级的宽度将为auto，这仍然会使其宽度为div.parent { background:yellow; color:brown; } div.child { background:brown; color:yellow; width:inherit; display:inline-block; }内容，而不是父母的宽度。

＆＃13;

<div class="parent">
  The parent (full width of the window)<br>
  <div class="child">
    The child (only as wide as its contents)
  </div>
</div>

＆＃13;

ClipBounds

＆＃13;

如果孩子的父母是“100％”或“继承”，孩子的宽度如何不同？

1 个答案: