Linuchs: Bild wird nicht absolut positioniert

Hallo,

irgendwie habe ich ein Brett vor dem Kopf, aber ich komme nicht drauf.

Für das Überblenden von Bildern möchte ich ein absolut positioniertes auf ein vorhandenes drauflegen. Parent beider Bilder ist eine relative td, das erste Bild soll die Höhe des td aufspannen, das zweite dann z-mässig drüberliegen.

Aber es liegt y-mässig drunter:

CSS:

table.tp590 {  
  width: 100%;  
  table-layout: fixed;  
  border-collapse: collapse;  
  margin-bottom: 0.5em;  
}  
table.tp590 tr td:nth-child(1) {  
  position: relative;  
}  
table.tp590 tr td:nth-child(1) img {  
  display: block;  
  width: 100%;  
}  
table.tp590 tr td:nth-child(1) img#bild_neu {  
  position: absolute;  
  z-index: 2;  
}  
table.tp590 tr td:nth-child(1) p {  
  position: absolute;  
  left: 10px;  
  bottom: 5px;  
  background-image: url( img/transp_weiss_40.png );  
  padding: 2px 5px 2px 5px;  
}

HTML:

<table class="tp590">  
  <tr>  
    <td>  
      <!--img src="fotos/steyr_panorama_winter_800_200.jpg" style="width:100%" alt=Steyr /-->  
      <img id=bild_alt src="http://remso.eu/img_orte/panorama_brunsbuettel_schleuse_800_200.jpg" alt="Brunsbüttel" />  
      <img id=bild_neu src="http://remso.eu/img_orte/brunsbuettel_kreuzfahrtschiff_J_Sievers_800_200.jpg" alt="Brunsbüttel" />  
      <p id=panorama_text>Brunsbüttel: Schleuse zwischen Elbe und Nordostseekanal (Wikipedia)</p>  
    </td>  
    <td></td>  

Warum wird die Angabe position:absolute ignoriert?

Linuchs

  1. Hi,

    Aber es liegt y-mässig drunter:

    table.tp590 {

    width: 100%;
      table-layout: fixed;
      border-collapse: collapse;
      margin-bottom: 0.5em;
    }
    table.tp590 tr td:nth-child(1) {
      position: relative;
    }

      
    The effect of 'position:relative' on table-row-group, table-header-group, table-footer-group, table-row, table-column-group, table-column, table-cell, and table-caption elements is undefined. (hieß es zumindest in CSS 2.1).  
      
      
    Ohne das zugehörige HTML ist das CSS ansonsten nicht wirklich brauchbar.  
      
    cu,  
    Andreas
    
    -- 
    [Warum nennt sich Andreas hier MudGuard?](http://MudGuard.de/)  
    [O o ostern ...](http://ostereier.andreas-waechter.de/)  
      
    Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.  
    
    
    1. Hallo,

      Ohne das zugehörige HTML ist das CSS ansonsten nicht wirklich brauchbar.

      korrekt, aber als Kritik hier unpassend. Das zugehörige HTML hatte Linuchs nämlich angegeben.

      Ciao,
       Martin

      --
      Das einzige Problem beim Nichtstun: Man weiß nie, wann man damit fertig ist.
      Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
    2. Hollo Anreas,

      The effect of 'position:relative' on table-row-group, table-header-group, table-footer-group, table-row, table-column-group, table-column, table-cell, and table-caption elements is undefined. (hieß es zumindest in CSS 2.1).

      Danke, habe noch einen <div> in table-cell eingezogen, jetzt klappt es auch mit dem Firefox.

      Linuchs

  2. Om nah hoo pez nyeetz, Linuchs!

    Warum wird die Angabe position:absolute ignoriert?

    Wird sie nicht. Es fehlt eine Angabe zu top.

    Matthias

    --
    Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Bor und Borg.

    1. Hallo Matthias,

      Warum wird die Angabe position:absolute ignoriert?

      Wird sie nicht. Es fehlt eine Angabe zu top.

      Mhhh, ich hatte angenommen, top:0 und left:0 wären Standard.

      Habe ich eingefügt, danke.

      Linuchs

      1. Hi,

        Es fehlt eine Angabe zu top.

        Mhhh, ich hatte angenommen, top:0 und left:0 wären Standard.

        Nein, der Defaultwert ist auto.

        MfG ChrisB

        --
        Autocomplete has spoiled me to a point where it happens every so often that I encounter a CAPTCHA, and I just type in the first character … and then wait for the rest of the code to be automatically suggested :/