Change location of popup box in style sheet? - asp.net

Question

I am using the following code to generate a popup box
<cc1:modalpopupextender ID="ErrorMessage" runat="server" TargetControlID="cmdHospitalNew"
PopupControlID="popupError" PopupDragHandleControlID="PopupHeader" Drag="true"
OkControlID="SubmitOk" BackgroundCssClass="ModalPopupBG">
</cc1:modalpopupextender>
<div class="popupConfirmation" id="popupError" style="display: none; background-color: White;
width: 200px; height: auto;">
<div id="popupErrorMessage" style="width: 190px">
<asp:Label ID="lbl_DB_popupError" runat="server" Text="Please fill all required fields!"></asp:Label></div>
<div id="popupErrorSubmitOk">
<input type="submit" id="SubmitOk" value="OK" style="visibility: visible;" /></div>
Is there a way to move this to the middle-Top-Left? Right now the popup is in the center of the screen. Here is the stylesheet I am using:
body {
}
.ModalPopupBG
{
background-color: #666699;
filter: alpha(opacity=50);
opacity: 0.7;
}

Answer 1

You can modifiy the CSS to include top & left positions based on where you want it to appear:
.ModalPopupBG
{
background-color: #666699;
filter: alpha(opacity=50);
opacity: 0.7;
top: 100px;
left: 100px;
}
Also, your code shows:
BackgroundCssClass="ModalPopupBG"
This should be:
CssClass="ModalPopupBG".

Answer 2

I believe you are in position: fixed; when you want to be position: absolute;, try that instead.
If that does not work, then try position: absolute!important; and see if that forces it to absolute position.

Answer 3

Try adding these 3 lines to your .ModalPopupBG class
position:absolute;
top:300px;
left:300px;
and tweak the pixels until it lines up to where you want it.