I've create a div container width some child div's in it. The child displays pictures via img
tags with percentage widths.
我创建了一个div容器宽度,其中包含一些子div。孩子通过img标签显示图片,宽度为百分比。
When I inspect the height of the parent div, my browser says it is 0px
, even though the pictures inside the child div have a non-zero height.
当我检查父div的高度时,我的浏览器说它是0px,即使子div中的图片具有非零高度。
How can I set the parent div automatically to the height of the greatest child when I only work width percent? This must work too, when I tweak the image sizes in the browser manually.
当我只处理宽度百分比时,如何将父div自动设置为最大孩子的高度?当我手动调整浏览器中的图像大小时,这也必须有效。
I tried to set the height and width of the parent div with jQuery, but it works only once and not dynamically. When I reload the page, the function will set the height of 16px.
我试图用jQuery设置父div的高度和宽度,但它只能运行一次而不是动态的。当我重新加载页面时,该函数将设置16px的高度。
2 个解决方案
#1
I am not sure if I understood your question correctly, but is this what you're looking for?
我不确定我是否理解你的问题,但这是你在寻找什么?
HTML:
<div class="out">
<div class="in"></div>
</div>
CSS:
.out {
background-color: blue;
}
.in {
background-color: green;
height: 50px;
width: 50%;
}
#2
Try this css with Parent div
用父div尝试这个css
overfolw:auto;
For Parent div
对于父级div
dispaly:table;
For child div :
对于儿童div:
display:table-row;
#1
I am not sure if I understood your question correctly, but is this what you're looking for?
我不确定我是否理解你的问题,但这是你在寻找什么?
HTML:
<div class="out">
<div class="in"></div>
</div>
CSS:
.out {
background-color: blue;
}
.in {
background-color: green;
height: 50px;
width: 50%;
}
#2
Try this css with Parent div
用父div尝试这个css
overfolw:auto;
For Parent div
对于父级div
dispaly:table;
For child div :
对于儿童div:
display:table-row;