z-index

问题 This is the code <ul> <li class="test"> <a href="#"> <h2>Blah</h2> <p>Blah Blah Blah</p> </a> </li> </ul> Basically, my list already has some styling, for example, I set the background-color for it. Now in the class "test", I also set a background-image. My question is I want to make the background-image stays above the background-color and I dont know how to achieve this. I tried with z-index but I think it is not applicable for background-image. Please take a look at the image Edit: This is

问题 I have a longlistselector with certain images that i add in this longlistselector. I also change the margins of this image to make the image go up or down and so on. But i want to put this image infront of another image in this longlistselector. I have tried using Canvas.Zindex. I have tried setting it at the grid level, at image level and at the top level of of the longlistselector.() But it still doesn't work. Does anybody have some idea's? You can find my code bellow: <phone

问题 Is it possible to arrange (z) order of objects in Flash with ActionScript 3? e.g. I have 3 symbol instances on a given layer, and I want to perform the equivalent of 'Bring to Front', 'Bring Forward', and/or target a certain z position. 回答1: You can change the z-index (stacking order) of a movie clip within a same layer using action script like this. parent.setChildIndex(childObject, i) Change childObject to the name of the movie clip you want to change the z-index, change i to an integer

问题 I have two elements in the same container, the first has position: absolute , the second position: relative . Is there a way to set the "z-index" of an absolute element so that its in the background? The relative positioned element should be on the top (z-layer) because it holds links... Here is a JSFiddle: http://jsfiddle.net/8eLJz/ The absolute positioned element is on the top of the z-layer and I have no influence with the z-index -property. What can I do? 回答1: I'm not sure which one you

问题 I'm having some trouble with the z-index. This is my simplified layout: <div id="overlapper"></div> <div id="container"> <div id="child1"></div> <div id="child2"></div> </div> I need overlapper to appear in front of child1 but behind child2 . I tried messing around with z index but it didn't work, I think because of the stacking context. Any help please? thanks 回答1: First, make sure that overlapper , child1 and child2 belong to the same stacking context. That is, make sure container doesn't

问题 see: http://jsfiddle.net/Kq2PY/ the div is relative with z-index 5, and the :after thing is absolute with z-index 2. So shouldn't :after be behind the div? 回答1: You would have to give pseudo elements a negative z-index to get it to go behind it's parent, plus remove the z-index on the parent. http://jsfiddle.net/jklm313/Kq2PY/4/ 来源： https://stackoverflow.com/questions/12463061/z-index-not-working-on-pseudo-elements

问题 Problem: On iOS the z-index of a scrollable area is ignored when using -webkit-overflow-scrolling . If two objects with -webkit-overflow-scrolling overlap the lower one is scrolled instead of the one being displayed above. How to reproduce: Create two elements overlaying each other (with position: absolute for example), one of them having a higher z-index and add .selector { overflow-y: auto; -webkit-overflow-scrolling: touch; } to both of them. Both elements should have enough content to be

问题 If I have something like this: Is there a way to fire the mouseover events on BOTH divs? Edit: Sorry all .. I tried to simplfy the problem so it was clear to understand and I forgot to mention I have more than 100 divs like that so probably those solutions don't work. I'm going to see if I can adpat them. Many thanks everybody anyway. 回答1: I put together a working example here with JSFiddle: http://jsfiddle.net/gfosco/CU5YT/ It's similar to madeinstefanos answer, but specific to your example.

问题 I'm trying to create a Bootstrap modal which contains an instance of CKEditor, but there are a lot of problems... So basically the fields are left unenabled, they don't look like, but I can't interact with them. Does anybody have a solution to this strange behavior? 回答1: FWIW, I couldn't get Peter's solution to work, but the following worked for me, and still keeps the hack in a separate file so you don't have to edit any Bootstrap source files: // bootstrap-ckeditor-modal-fix.js // hack to

问题 Instead of scrolling down the page to view a bunch of divs, I would like them to overlay in the same place-- one stacked on top the next -- when you scroll. So, you would scroll down, but the page would not go down. Instead, the next div would overlay the first and so on and so forth. Not sure how to do this? Here is what I have: UPDATE .container { width:100%; height:100%; position:relative; } .container1 { display:block; position:fixed; margin-top:690px; width:100%; height:500px; z-index:1;