Well actually, the items later in the HTML markup will go over the ones earlier. From the example:
Code:
<img src="test.gif" class="drag"><br>
<img src="test2.gif" class="drag"><br>
<h1><b class="drag">Hi there</b></h1>
Hi there will always be on top, test2.gif will always be on top of test.gif but under Hi there, test.gif will always be under the other two. To change this behavior, either change the order or use the z-index property of each element's style. For example, we can reverse the situation with z-index:
Code:
<img src="test.gif" class="drag" style="z-index:100;"><br>
<img src="test2.gif" class="drag" style="z-index:50;"><br>
<h1><b class="drag" style="z-index:10;">Hi there</b></h1>
Now test.gif will always be on top and Hi there always on the bottom. I used 100, 50 and 10 but you can use any numbers. The higher z-index will always be on top of the lower z-index.
Bookmarks