Div aus anderem Div über den Rand hinweg darstellen

  • Hi nochmal!

    Ich habe dank der Hilfe von "bugcatcher" mittlerweile ein großes Problem auf der Seite http://de.tms-od.de/ gelöst. Ich habe nun ein Drop-Down-Menü mit CSS erstellt (JS wollte ich nicht voraussetzen ;) ), habe jetzt jedoch ein Problem:

    Das Drop-Down-Menü geht (für mich logisch) nicht über das darüber liegende Div (width: 100px) hinaus. Gibt es dafür ein css-(naja, wie heißt das denn...)befehl? Damit ich auch längere Menüeinträge ohne Umbruch darstellen lassen kann?

    PS: Ich will niemanden stressen, da ihr mir nur beim anderen Problem so schön schnell geholfen habt "versuche" ich es einfach nochmal ;)

    Schöne Grüße,
    Lars Knickrehm

  • Okay, daran hatte ich auch schon gedacht, aber weiter hat mich die Überlegung auch nicht gebracht...

    PS: Erstmal muss alles im Firefox laufen...IE und Opera kommen danach^^

    Schöne Grüße,
    Lars Knickrehm

  • Naja. Du sagst dem <ul> das es z.b.

    Code
    min-width:100px;
    max.width:150px;


    sein soll.
    Den <li>s verpasst Du:

    Code
    white-space:nowrap;
    overflow:hidden;
    width:auto;


    Dann sollte sich das <ul> am längsten <li> ausrichten, und alle anderen <li> passen sich dann der veränderten größe vom <ul> an. Theoretisch. Muss man halt mal ausprobieren.

    Wenn man es logisch macht, zeigen Firefox und Opera in der Regel eigentlich immer das selbe an. IE steht natürlich auf einem anderen Blatt.

  • Okay, ich habe mich anscheinend nicht so ausgedrückt, wie ich es meinte:

    [Blockierte Grafik: http://lars-sh.de/problem.jpg]

    Das rote Div muss über das schwarze überlappen, obwohl es in diesem ist.

    Außerdem habe ich ein Problem mit height: auto; und dem IE(7)... hat da jemand ne Ahnung?

    PS: Wegen letzterem habe ich die Höhe jedes Menüs auf 185px gesetzt, würde das aber gerne wieder zurücksetzen (naja, der IE ist nunmal Sorgenkind... :( )

    PPS: Kurtz zur Technik: Die Höhe des schwarzen Elementes wird einfach per :hover größer gesetzt (eigentlich ja auto, wenn das im IE gehen würde...) und ansonsten ist die Höhe bei 25px!

    Schöne Grüße,
    Lars Knickrehm

  • Aber lass das "Optimiert für Firefox" weg, das erinnert an Zeiten ala "Optimiert für IE 5 bei Auflösung 5234x430" :wink:

    Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.0.1) Gecko/2008070206 Firefox/3.0.1 (Gentoo Linux)

  • Ha, danke!

    Damit kann ich zwar keine variable, an den Text angepasste Breite benutzen, ist aber eher verwirrend, also habe ich jetzt einfach eine feste Breite von 150px!

    Zur Unterstützung: Die Leute, die die Seite besuchen (vielleicht ist euch aufgefallen, dass es eine Schul-HP ist ;) ) haben meistens nicht so viel Ahnung und müssen quasi zu ihrem Glück (Firefox - ich denke Opera, Safari und Konqueror müssten auch gehen...) gezwungen werden.

    Aja, gibt es eigentlich eine Möglichkeit, dass der IE eine Eigenschaft ähnlich der opacity verwendet? Über JS bekomme ich zwar transparenz hin, aber irgendwie nicht per CSS...

    Nein: Ich glaub es ja nicht, nun gibt es Probleme mit Opera... Ich liebe diese "Unterstürzung" der Standards... *Augenroller* - Ist nicht so wichtig, aber wenn jemand eine Idee hat ;)

    DANKE nochmal, echt klasse!

    PS: Wenn ihr wissen wollt, was ich normalerweise mache, schaut her: eyeos.org (hauptsächlich JS und PHP, da ist HTML und CSS nicht ganz so wichtig...;) )

    Schöne Grüße,
    Lars Knickrehm

  • Okay, ich habe nun noch ein wenig weitergearbeitet! Für die Browser, die es nötig haben, habe ich schon ein eigenes CSS erstellt und eingerichtet!

    Meine letzten Probleme:

    * opacity (Transparenz) im IE geht nicht. Gibt es dafür eine weitere Möglichkeit?
    * Opera zeigt anstatt des verbreiterten roten Divs (siehe Bild unten) eine Scrollbar für das schwarze Div an! Gibt es auch dafür eine Lösung?

    PS: Ist schon ein wenig merkwürdig im MF-Forum nach Hilfe zu Opera und zum IE zu fragen...

    Schöne Grüße,
    Lars Knickrehm