div height for an inner div

Question

I'm appending a div inside another div like this:

$('#maindivid').append('<div id="newid" style="background: url(xyz/image/test.png); position:absolute; min-height:100%; width:100%; height:100%; top:0px; left:0px; overflow:auto;"></div>');

But my new div doesn't get the entire height of the container div . How can this be achieved?

Answer 1

将新div的属性设置为height:inherit ；

Answer 2

尝试设置父级div的高度，然后将子级的高度设置为100％。

Answer 3

Parent Div:

<div id="maindivid" scrollleft="0" scrolltop="0" style="border:1px solid black; width: auto; height: 561.4px;" class="class-new " >
       Parent Border
</div>​

script to append the child:

 $('#maindivid').append('<div id="childid" style="border: 1px solid red; position:absolute; width:100%; height:inherit; ">Child</div>'); ​

this works on jsfiddle.net: http://jsfiddle.net/qY47q/

Note: I did remove the height:100% on the child because you've already specify that the height will be inherit to the parent. Also, I added border so that I could see the actual height of the div