I am trying to create a pop-up div with dynamic data that is centered on the screen. I have set the height to 300px, width to 70%, and enabled vertical scrolling.
When viewing in IE7/IE8, the div appears as intended, centered on the screen with the specified dimensions, and scrolls when necessary. However, in IE6, the width of 70% does not work correctly. The width of the div adjusts based on the size of the data, which is not ideal since the content is dynamic and sometimes the pop-up does not render properly on high-resolution screens.
Any suggestions on how to fix this issue would be greatly appreciated.
<div id="outerDiv" class="panelDialog" style="position:absolute; display:none; width:70%;">
<div id="div2" title="Search Provider">
<a href="#" id="href1" title="Close">
<img id="img1" title="Close" alt="Close" />
</a>Search Popup
</div>
<div id="div3">
<div style="height: 300px; overflow-y: scroll;">
<TABLE>
<TR>
<TD width="100%"></TD>
</TR>
</TABLE>
<input type="reset" value="Close" id="btn1" name="nae1" class="commandExButton" />
</div>
</div>
</div>