Percent size youngster component in definitely located moms and dad on Internet Explorer 7

I have a definitely located div having numerous youngsters, among which is a reasonably located div. When I make use of a percentage-based size on the youngster div, it falls down to '0' size on Internet Explorer 7, yet out Firefox or Safari.

If I make use of pixel size, it functions. If the moms and dad is reasonably located, the percent size on the youngster functions.

  1. Exists something I'm missing out on below?
  2. Exists a very easy solution for this besides the pixel-based size on the youngster?
  3. Exists a location of the CSS requirements that covers this?
0
2019-05-07 00:03:55
Source Share
Answers: 2

The moms and dad div requires to have actually a specified width, either in pixels or as a percent. In Internet Explorer 7, the moms and dad div requires a specified width for youngster percent divs to function appropriately.

0
2019-05-08 19:52:04
Source

Here is some example code. I assume this is what you are seeking. The adhering to display screens specifically the very same in Firefox 3 (mac) and also IE7.

#absdiv {
  position: absolute; 
  left: 100px; 
  top: 100px; 
  width: 80%; 
  height: 60%; 
  background: #999;
}

#pctchild {
  width: 60%; 
  height: 40%; 
  background: #CCC;
}

#reldiv {
  position: relative;
  left: 20px;
  top: 20px;
  height: 25px;
  width: 40%;
  background: red;
}
<div id="absdiv">
    <div id="reldiv"></div>
    <div id="pctchild"></div>
</div>

0
2019-05-08 15:07:22
Source