position: fixed; partially renders div when in update panel

Posted by Shoab.Shah under ASP.NET AJAX on 7/2/2015 | Points: 10 | Views : 444 | Status : [Member] | Replies : 1
Hi All,

I have a div placed in updatepanel.

When i keep css of my div as below it displays fully ;

<div runat ="server" id ="divNotificationMsg" style="display:none; z-index:10000; position:absolute; left:10%; top:10%; width:80%; padding: 15px 5px;" >

whereas when i keep below the div gets cut off partially from right.

<div runat ="server" id ="divNotificationMsg" style="display:none; background-color:#FFFFFF; z-index:10000; position:fixed; left:10%; top:10%; width:80%; padding: 15px 5px;" >


Posted by: Sheonarayan on: 7/2/2015 [Administrator] HonoraryPlatinum | Points: 25

position:absolute float the div on top of the existing elements and as you have specified z-index to higher so it is coming on top of every element. Layering system is working here. When you scroll, the div will also scroll along with the window.

position:fixed makes the div fixed to the position you specify in the .css. ie left or top. The possibility in this case is that some other element is coming on top of this element and making it partially cut from the right. Try to specify all div with border and see which div area is going where (another way to debug) or else you Developer tools or Firebug to debug the HTML.


Sheo Narayan

Shoab.Shah, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response