html - Google chrome not obeying z-index when inside a fixed element. -


I am installing an interface for a social network, however, I have a problem with the z-index in Google Chrome is. It seems that working in Safari, Firefox and Internet Explorer.

View my layout on JSFDL:

The side bar should be fixed on the left side of the screen and in the gray incarnation above the dark brown block on top.

If the position in the # sidebar is fixed, then the # user_avatar's z-index is ignored. If you set the position of the # sidebar for the relative or absolute, the # user_avatar's z-index is fine.

  # sidebar {width: wise; Status: fixed; Display area; } #user_avatar {margin: 0 auto; Width: 120px; Height: 120px; Border: 4px solid white; Background color: # 555; Display area; Margin top: -100px; Status: Relative; Z-index: 501; }  

I am on Google Chrome version: Version 32.0.1700.107

Any advice? The problem is that Chrome creates new things for those who have z-index

is not set (default is auto). So there is a z-index in your sidebar that makes it (and all its children) disappear because you have your #top < / Code> Contains a high z-index for the container.

To solve the problem, more than z < Code> Above:

  #sy Dabur {width: heir; position: fixed; display area; Z-index: 501;}  


Comments