Databases
StackOverflow2013
Postsdbo
POCSS: can't understand how to work with the z-index
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POCSS: can't understand how to work with the z-index
    primarykey
    data
    text
    <p>First of all I am a programmer (Python, C, Java, Delphi, whatever) and not a web developer/designer. I am trying hard to be (when asked) so please bear with me. :-)</p> <p>I have a map (background image of div). On the map I have placed some cities (div with image). Underneath the cities there are cars (div with image, too). Each car can travel to any city (drag-drop, I am working on this now). Cities and cars, when clicked-once, show pop up dialogs with extra information. </p> <p>Up to here, no news. What a normal programmer would want is to have the map on the first level (i.e. z-index 0) cities on the next (i.e. z-index 10) cars on the next (z-index 20 because when dragged and dropped cars should appear above the cities and not bellow) and finally above all the popups (z-index 999). </p> <p>However this is not the case. Cars when dragged "fly" above some cities and "pass" below some other (depending if they were placed before or after the city while rendering the page, I suppose). </p> <p>I was trying hard to place a div (to draw lines) in between the map div and the cities (ie z-index 5) but to no avail.</p> <p>Popups also have problems.</p> <p>I also tried this piece of code:</p> <pre><code>jQuery(document).ready(function(){ map_zindex = $("#map").css("z-index"); $(".city").css("z-index", map_zindex+10); $(".car").css("z-index", map_zindex+100); $(".popup").css("z-index", map_zindex+200); }); </code></pre> <p>Still nothing changes (not even a small progress). Nothing. Worst of all, when checking with <a href="http://en.wikipedia.org/wiki/Firebug" rel="nofollow">Firebug</a> I was getting a <code>z-index: auto;</code> to all of those elements.</p> <p>I know I must be doing something completely wrong, but what is it? I hope my dislike for CSS is not causing all this mess. </p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USPeter Mortensen
    1. USxpanta
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POCSS: can't understand how to work with the z-index
      1. This table or related slice is empty.
      1. VTDownMod
    2. VO
      singulars
      1. POCSS: can't understand how to work with the z-index
      1. This table or related slice is empty.
      1. VTUpMod
    1. COmake sure they all are positioned either relatively or absolutly
      singulars
      1. POCSS: can't understand how to work with the z-index
      1. USBreezer
    2. COi assume all the divs in question have `position: absolute` or `position:relative`. HAve you tried using a stylsheet to jsut set all the divs of a certain type to a z-index like `.city {z-index: 10;} .car {z-index: 20;} .popup {z-index: 30;}`?
      singulars
      1. POCSS: can't understand how to work with the z-index
      1. USprodigitalson
    3. COYour question title is just begging for a downvote.
      singulars
      1. POCSS: can't understand how to work with the z-index
      1. UShobbs
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload