Center div when using AnimationExtender

 I'm trying to center a div that pops up when I click on a button. It works fine and fades in/out but I need to center it on the screen. Can anyone point me in the right direction. Here is a snippet of my code. 

 <ajaxToolkit:AnimationExtender id="OpenHelp" runat="server" TargetControlID="btnHelp"> <Animations> <OnClick> <Sequence> <StyleAction Attribute="display" Value="" AnimationTarget="divScanHelp" /> <FadeIn AnimationTarget="divScanHelp" Duration=".3"/> </Sequence> </OnClick> </Animations> </ajaxToolkit:AnimationExtender> <ajaxToolkit:AnimationExtender id="CloseHelp" runat="server" TargetControlID="btnClose2"> <Animations> <OnClick> <Sequence> <FadeOut AnimationTarget="divScanHelp" Duration=".3"/> </Sequence> </OnClick> </Animations> </ajaxToolkit:AnimationExtender> <div id="divScanHelp" class="ScannerHelp" style="width: 330px; height: 224px; display: none;"> <table border="0" width="100%" cellpadding="2" cellspacing="1"> <tr><td align="right"><asp:ImageButton ID="btnClose2" runat="server" OnClientClick="return false;" CausesValidation="false" ImageUrl="./graphics/Icon_Close_Small.gif" ToolTip="Close" /></td></tr> <tr><td valign="middle" align="center" style="margin-top: 8px;"><img src="./graphics/scan-label.gif" border="0" width="300" height="194" style="border: 1px solid #c0c0c0;"></td></tr> </table> </div>

Add a Script animation to your OnClick sequence to invoke a javascript function that centers the div.

Use the _layout method of the ModalPopupBehavior class (ModalPopupBehavior.js in the toolkit) as a guide for developing your own center function. If you have relatively-positioned containers in your div's ancestry, look at my other post titled "For those having trouble with relatively-positioned ModalPopupExtenders."

Hope this helps.