samurai: Element trotz overflow:hidden überlappen lassen (erzwingen)

Moin,

SITUATION:
ich hab einen content div mit der Eignenschaft overflow:hidden damit das Layout (viele grafische Elemente) passend angezeigt wird und nichts vom Layout überlappt. Nun möchte ich dass eine Infobox aufgeht, wenn  man mit der Maus über einen kleinen Button fährt. Das ist soweit kein Problem.

PROBLEM:
Die Infobox hat ziemlich viel Infotext und ist dementsprechend groß.
Das Problem ist nun, dass diese Infobox beim aufgehen von dem content div zum Teil verdeckt/abgeschnitten wird, da dieser ja die Eigenschaft hat nichts überlappen zu lassen (overflow:hidden;).

FRAGE:
kann ich es irgendwie erzwingen, dass NUR die Infobox über den Rand des content divs angezeigt wird?

Ich hoffe ich habe mich einigermaßen verständlich ausgedrückt
und danke euch für jeden Tipp.

Der Samurai.

  1. Hallo,

    du könntest die Infobox im Quelltext außerhalb des Divs mit overflow:hidden Eigenschaft platzieren und per css über dein Div verschieben.

    Viele Grüße Novi

    --
    "(...) deshalb mag ich Binärtechnik. Da gibt es nur drei Zustände: High, Low und Kaputt." (Wau Holland)
    1. Hey Novi,

      danke für diesen Denkansatz.
      Ich dachte es lassen sich nur verschachtelte Elementen per :hover bedienen
      wie z.B.

        
      span#infobox{display:none;}  
      span#erster:hover span#infobox {display:block;}
      

      <span id="erster">TEXT<span id="infobox">Hier stehen Infos</span></span>

      Habe versucht den span infobox aus dem ersten span rauszunehmen, aber dann klappt dieser nicht mehr auf wenn ich mit der Maus über TEXT gehe.

      Geht das überhaupt? Hab ich was übersehen?

  2. SITUATION:
    ich hab einen content div mit der Eignenschaft overflow:hidden damit das Layout (viele grafische Elemente) passend angezeigt wird und nichts vom Layout überlappt. Nun möchte ich dass eine Infobox aufgeht, wenn  man mit der Maus über einen kleinen Button fährt. Das ist soweit kein Problem.

    PROBLEM:
    Die Infobox hat ziemlich viel Infotext und ist dementsprechend groß.
    Das Problem ist nun, dass diese Infobox beim aufgehen von dem content div zum Teil verdeckt/abgeschnitten wird, da dieser ja die Eigenschaft hat nichts überlappen zu lassen (overflow:hidden;).

    OK: Du lässt sehr viele Info vermissen.
    Tatsache ist, dass das Element, das als Koordinatensystem dient, also auch overflow:hidden trägt.
    Die Lösung ist, Trenne diese beide Eigenschaften durch ein zusätzliches Element.

    mfg Beat

    --
    ><o(((°>           ><o(((°>
       <°)))o><                     ><o(((°>o
    Der Valigator leibt diese Fische
    1. Danke für die Antwort:

      OK: Du lässt sehr viele Info vermissen.

      Welche Infos brauchst du denn?

      Die Lösung ist, Trenne diese beide Eigenschaften durch ein zusätzliches Element.

      Das verstehe ich leider nicht. Welche beiden Eigenschaften? Ich habe doch erstmal nur eine Eigenschaft, nämlich overflow:hidden.
      Welches zusätzliche Element?

      Gruß

      1. OK: Du lässt sehr viele Info vermissen.
        Welche Infos brauchst du denn?
        Die Lösung ist, Trenne diese beide Eigenschaften durch ein zusätzliches Element.
        Das verstehe ich leider nicht. Welche beiden Eigenschaften? Ich habe doch erstmal nur eine Eigenschaft, nämlich overflow:hidden.
        Welches zusätzliche Element?

        Ach ja... reden wir von Code. Das ist ganz gut.
        Kreise doch mal dein Problem genauer ein. Ich weiss nicht, wo in deinem Link dein Problem genau stattfindet.

        mfg Beat

        --
        ><o(((°>           ><o(((°>
           <°)))o><                     ><o(((°>o
        Der Valigator leibt diese Fische
    2. span#infobox{display:none;}  
      span#erster{overflow:hidden;}  
      div:hover span#infobox {display:block;}
      
      <div>  
      <span id="erster">TEXT</span>  
      <span id="infobox">Hier stehen Infos</span>  
      </div>