CSS : Maintaining fixed height for DIV in Firefox and IE

Question

I have a master div and inside that i am showing multiple divs as a list.My HTML as below

<div id='divMasterContainer' style="height:200px;">
  <div id='child1'>
       // Some child contents here (Radio button / Button etc.. )
  </div>
  <div id='child2'>
    // Some child contents here (Radio button / Button etc.. )
  </div>
  <div id='child3'>
    // Some child contents here (Radio button / Button etc.. )
  </div>
</div>

So when rendering in firefox, ,The mastercontainer div is of height 200 px .But in IE , Its growing as of the number of child divs it holds. I am using these div's with jFlow plugin to implement a slider control. I want to mainitain the same height for the master div in both the browsers. and i dont need a scrollbar in the master div too.

Answer 1

Maybe you could try having this in the style tag:

overflow:hidden;

Answer 2

You need to make sure the master div has an overflow of 'hidden':

<div id='divMasterContainer' style="height:200px;overflow:hidden;">