父母div有两个孩子。即使不显示其他孩子,也要始终让一个孩子填满父母吗?

达斯

我有一个父母div,有两个孩子。其中一个孩子将不会始终显示。如何使另一个孩子div填充父对象的高度而不会溢出?

我的第一个不会总是显示的孩子的身高是固定的。我尝试将第二个孩子的高度设置为100%,如果没有显示第一个孩子,则可以使用该高度,但是当第二个孩子不显示时,该高度就可以使用。

这是我的问题的小提琴:

.parent {
    height: 400px;
    width: 400px;
    background: red;
    border: 1px solid black;
}

.child1 {
    height: 30px;
    background: green;
}

.child2 {
    height: 100%;
    background: blue;
}

http://jsfiddle.net/4fdf8ksy/

乔什·克罗齐耶(Josh Crozier)

您可以使用flexbox布局

只需将.parent元素设置displayflex并添加flex-direction: column

更新示例

.parent {
  height: 400px;
  width: 400px;
  background: red;
  border: 1px solid black;
  display: flex;
  flex-direction: column;
}
.child1 {
  height: 30px;
  background: green;
}
.child2 {
  height: 100%;
  background: blue;
}
<div class="parent">
  <div class="child1"></div>
  <div class="child2"></div>
</div>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

父母div有两个孩子。即使不显示其他孩子,也总是让一个孩子填满父母吗?

来自分类Dev

休眠两个父母一个孩子映射

来自分类Dev

选择一个父母和所有给定父母或孩子ID的孩子

来自分类Dev

选择一个父母和所有给定父母或孩子ID的孩子

来自分类Dev

从两个父母 CSS 获取所有特定的孩子

来自分类Dev

由父母的另一个孩子生孩子

来自分类Dev

打开一个孩子的div点击父母的

来自分类Dev

为现有父母保存一个孩子

来自分类Dev

Android:视图-孩子已经有一个父母

来自分类Dev

将一个孩子的改变传达给父母的父母

来自分类Dev

两个不同父母的孩子可以在React中拥有相同的键吗

来自分类Dev

将<ul>分为两个div,一个用于第一个孩子,另一个用于其他孩子

来自分类Dev

将<ul>分为两个div,一个用于第一个孩子,另一个用于其他孩子

来自分类Dev

我如何称呼有至少一个孩子关系的孩子的父母?

来自分类Dev

一个孩子可以在Sprite Kit中有多个父母吗?

来自分类Dev

一个孩子可以在谷歌扳手中有多个父母吗?

来自分类Dev

Android | 指定的孩子已经有一个父母。您必须先在孩子的父母上调用removeView()

来自分类Dev

指定的孩子已经有一个父母。您必须先在孩子的父母上调用removeView()。(C#)

来自分类Dev

指定的孩子已经有一个父母。您必须先对孩子的父母调用removeView()

来自分类Dev

指定的孩子已经有一个父母。您必须先在孩子的父母上调用removeView()”

来自分类Dev

指定的孩子已经有一个父母。您必须先在孩子的父母上调用removeView()

来自分类Dev

指定的孩子已经有一个父母。您必须先在孩子的父母上调用removeView()。(C#)

来自分类Dev

Android | 指定的孩子已经有一个父母。您必须先在孩子的父母上调用removeView()

来自分类Dev

C语言中父母与两个孩子之间的管道

来自分类Dev

C语言中父母与两个孩子之间的管道

来自分类Dev

与父母一起举一个孩子的例子

来自分类Dev

干CSS-多个父母一个孩子

来自分类Dev

祖父母的第一个孩子

来自分类Dev

管道同一个父母的多个孩子

Related 相关文章

  1. 1

    父母div有两个孩子。即使不显示其他孩子,也总是让一个孩子填满父母吗?

  2. 2

    休眠两个父母一个孩子映射

  3. 3

    选择一个父母和所有给定父母或孩子ID的孩子

  4. 4

    选择一个父母和所有给定父母或孩子ID的孩子

  5. 5

    从两个父母 CSS 获取所有特定的孩子

  6. 6

    由父母的另一个孩子生孩子

  7. 7

    打开一个孩子的div点击父母的

  8. 8

    为现有父母保存一个孩子

  9. 9

    Android:视图-孩子已经有一个父母

  10. 10

    将一个孩子的改变传达给父母的父母

  11. 11

    两个不同父母的孩子可以在React中拥有相同的键吗

  12. 12

    将<ul>分为两个div,一个用于第一个孩子,另一个用于其他孩子

  13. 13

    将<ul>分为两个div,一个用于第一个孩子,另一个用于其他孩子

  14. 14

    我如何称呼有至少一个孩子关系的孩子的父母?

  15. 15

    一个孩子可以在Sprite Kit中有多个父母吗?

  16. 16

    一个孩子可以在谷歌扳手中有多个父母吗?

  17. 17

    Android | 指定的孩子已经有一个父母。您必须先在孩子的父母上调用removeView()

  18. 18

    指定的孩子已经有一个父母。您必须先在孩子的父母上调用removeView()。(C#)

  19. 19

    指定的孩子已经有一个父母。您必须先对孩子的父母调用removeView()

  20. 20

    指定的孩子已经有一个父母。您必须先在孩子的父母上调用removeView()”

  21. 21

    指定的孩子已经有一个父母。您必须先在孩子的父母上调用removeView()

  22. 22

    指定的孩子已经有一个父母。您必须先在孩子的父母上调用removeView()。(C#)

  23. 23

    Android | 指定的孩子已经有一个父母。您必须先在孩子的父母上调用removeView()

  24. 24

    C语言中父母与两个孩子之间的管道

  25. 25

    C语言中父母与两个孩子之间的管道

  26. 26

    与父母一起举一个孩子的例子

  27. 27

    干CSS-多个父母一个孩子

  28. 28

    祖父母的第一个孩子

  29. 29

    管道同一个父母的多个孩子

热门标签

归档