Horst Nogajski: Kann man die Anzeigelänge eines Select-Feldes begrenzen?

Halli hallo,

hmm, ich bastel' mir hier gerade etwas, würde aber gerne ein dreisterweise raumgreifendes Dropdown-Select etwas in der Anzeigelänge begrenzen. Geht das? Und wenn ja, wie?

Eigentlich ist es mir auch egal ob das mit CSS oder mit reinem HTML 4 geht. Ich habe nur leider für das Select nichts gefunden. (Im gegensatz zu einem TextInput, das habe ich ganz hervorragend in Höhe,Länge, Schrift und Farben definieren können).

Also um allen Missverständnissen vorzubeugen, ich meine nicht die Zeilenanzahl (size=4 o.ä.) sondern ich möchte die Länge (oder Breite) z.B. auf 200 Pixel begrenzen.

______

Ansonsten wundere ich mich nur mal wieder was Browser alles so für Macken haben, (habe ja lange nichts mehr gemacht):

Da refreshe ich doch eine Seite relativ regelmäßig per Meta-Refresh, und sende dann auch noch artig alle möglichen Header gegen Caching, und was macht mein so heiß geliebter Mozilla? Es ist nicht zu glauben:
Er zeigt alle dynamisch generierten Seitenelemente (hier: Fenstertitel, und einige Textpassagen) richtig an, bis auf ein 'ach mit so wichtigen Informationen' gefülltes DropdownSelect.
Dieses wird natürlich so generiert das, entsprechend der aktuellen Seite, auch die aktuelle Option mit 'selected' gekennzeichnet ist.
Aber der Mozilla zeigt es partout nicht richtig an. Er hält sich einfach (man möchte fast sagen krampfhaft) an dem ersten Eintrag fest.

Eine Überprüfung des Quelltextes zeigt natürlich das die Datei richtig ausgeliefert wurde, auch an den Mozilla. (Andere Browser die ich hier noch habe, IE, Opera und der alte NN4 zeigen das auch richtig an).

Nun ja, ich verstehe ja nicht viel von diesen technischen Dingen, doch  scheint es mir in diesem Fall nicht zu verwegen, dieses Mozilla-Verhalten als absurd zu bezeichnen.  =:)

Viele Grüße,
Horst

  1. Hi,

    hmm, ich bastel' mir hier gerade etwas, würde aber gerne ein dreisterweise raumgreifendes Dropdown-Select etwas in der Anzeigelänge begrenzen. Geht das? Und wenn ja, wie?

    CSS kennt eine max-width-Eigenschaft.

    Eigentlich ist es mir auch egal ob das mit CSS oder mit reinem HTML 4 geht.

    Wenn es die Darstellung betrifft, ist es CSS.

    Ich habe nur leider für das Select nichts gefunden.

    Im Prinzip sind Eigenschaften nicht auf Tags bezogen, höchstens auf Tag-Arten (etwa "Blocklevel" oder "Inline"). Der "Fehler" besteht darin, dass width nicht die _maximale_ Breite ist und somit bei der Notwendigkeit einer größeren Breite gewissermaßen hinfällig wird.

    [Mozilla] zeigt alle dynamisch generierten Seitenelemente (hier: Fenstertitel, und einige Textpassagen) richtig an, bis auf ein 'ach mit so wichtigen Informationen' gefülltes DropdownSelect.
    Dieses wird natürlich so generiert das, entsprechend der aktuellen Seite, auch die aktuelle Option mit 'selected' gekennzeichnet ist.

    Wenn sich die Struktur ändert, also bei <select> beispielsweise die Menge der enthaltenen <option>-Tags, dann aktualisiert Mozilla dies. Ansonsten behält er die Inhalte bei, bei einem <select> also den ausgewählten Wert. Spätestens bei einer Back/Forward-Navigation wirst Du den Sinn davon erkennen.

    Aber der Mozilla zeigt es partout nicht richtig an. Er hält sich einfach (man möchte fast sagen krampfhaft) an dem ersten Eintrag fest.

    Dann war dieser ursprünglich selektiert. Lade die Seite mal mit gehaltener Shift-Taste neu. Ob dies autmatisierbar ist, ist mir nicht bekannt. Im HTTPS-Umfeld ist das Caching-Verhalten des Mozilla strikter, vielleicht hilft Dir das.

    Nun ja, ich verstehe ja nicht viel von diesen technischen Dingen, doch  scheint es mir in diesem Fall nicht zu verwegen, dieses Mozilla-Verhalten als absurd zu bezeichnen.  =:)

    Nur in Deiner speziellen Situation :-)

    Cheatah

    --
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hi Cheatah,

      CSS kennt eine max-width-Eigenschaft.

      jo, das passt :-)

      [Mozilla] zeigt alle dynamisch generierten Seitenelemente (hier: Fenstertitel, und einige Textpassagen) richtig an, bis auf ein 'ach mit so wichtigen Informationen' gefülltes DropdownSelect.
      Dieses wird natürlich so generiert das, entsprechend der aktuellen Seite, auch die aktuelle Option mit 'selected' gekennzeichnet ist.

      Wenn sich die Struktur ändert, also bei <select> beispielsweise die Menge der enthaltenen <option>-Tags, dann aktualisiert Mozilla dies. Ansonsten behält er die Inhalte bei, bei einem <select> also den ausgewählten Wert. Spätestens bei einer Back/Forward-Navigation wirst Du den Sinn davon erkennen.

      Hm, ich habe gerade mal back-forward geklickt, muß aber leider berichten, das mir der Sinn dieses Verhaltens verborgen geblieben ist. Mit anderen Worten: ich hab's nicht kapiert ;-)

      Ein Beispiel:
      Mein Select hat 10 Einträge
      Bei der ersten Anzeige ist das 5te selected und wird auch angezeigt.
      Nach einem oder mehreren Refreshs ist das 7te selected, aber das 5te wird immer noch angezeigt.
      Jetzt klicke ich mal einen Link an, die Seite wird geladen und auch das Select ist wieder aktualisiert.
      Mit der Backward-Forward Aktion sehe ich jetzt genau das Gleiche:
      Backward = eine Seite mit meinem 'falschen Select-Eintrag'
      Forward = die Seite mit dem neuen Eintrag.

      Vielleicht habe ich das Beispiel auch falsch gewählt?

      [...] Dann war dieser ursprünglich selektiert. Lade die Seite mal mit gehaltener Shift-Taste neu.

      Ja, das geht, aber nur mit Shift-F5, nicht mit einfach F5.
      (Und grundsätzlich möchte ich ja ohne mein aktives Dazutun immer richtig Informiert werden. Deshalb ja ein 'Auto'-Refresh)

      Ob dies autmatisierbar ist, ist mir nicht bekannt. Im HTTPS-Umfeld ist das Caching-Verhalten des Mozilla strikter, vielleicht hilft Dir das.

      Nun ja, ich verstehe ja nicht viel von diesen technischen Dingen, doch  scheint es mir in diesem Fall nicht zu verwegen, dieses Mozilla-Verhalten als absurd zu bezeichnen.  =:)

      Nur in Deiner speziellen Situation :-)

      Ja, das mag schon sein, doch bringt mich diese Erkenntnis, (welche sich mir immer noch nicht ganz erschlossen hat, s.o.), eben in meiner speziellen Situation überhaupt nicht weiter =:)

      Also die einzige Möglichkeit die sich mir jetzt spontan aufdrängt, welche ich aber genauso vehement auch wieder verscheuchen möchte, ist: das 'nur-in-meiner-speziellen-Situation-absurde-Verhalten' mittels JavaScript zu korrigieren.
      Bisher bin ich mit dem Script komplett unabhängig von JS und würde es eigentlich auch gerne bleiben.

      Viele Grüße,
      Horst

      PS: ... ich mag den Mozilla auch sehr. Schlieslich ist er mein Standard-Browser.

      1. Hi,

        Hm, ich habe gerade mal back-forward geklickt, muß aber leider berichten, das mir der Sinn dieses Verhaltens verborgen geblieben ist. Mit anderen Worten: ich hab's nicht kapiert ;-)

        wenn Du irgendwo ein Formular ausgefüllt hast, dieses abschickst und anschließend noch mal zurück gehst, um es zu ändern und erneut abzuschicken, siehst Du den Sinn.

        Ein Beispiel:
        Mein Select hat 10 Einträge

        Dein aktueller Fall ist kein wirklich gutes Beispiel :-)

        Bei der ersten Anzeige ist das 5te selected und wird auch angezeigt.
        Nach einem oder mehreren Refreshs ist das 7te selected, aber das 5te wird immer noch angezeigt.

        Nicht bei einem Shift+Reload. Wie gesagt, eine Automatisierung ist mir nicht bekannt - der Browser geht davon aus, dass ein Benutzer vor ihm sitzt, der über die Auswahl entscheidet.

        [...] Dann war dieser ursprünglich selektiert. Lade die Seite mal mit gehaltener Shift-Taste neu.
        Ja, das geht, aber nur mit Shift-F5, nicht mit einfach F5.

        Sag ich doch :-)

        (Und grundsätzlich möchte ich ja ohne mein aktives Dazutun immer richtig Informiert werden. Deshalb ja ein 'Auto'-Refresh)

        Die HTML-Struktur muss sich ändern - oder die URL.

        Cheatah

        --
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
        1. Hallo,

          Die HTML-Struktur muss sich ändern - oder die URL.

          Hm, ja, eigentlich ändert sich die HTML-Struktur ja ein wenig, schlieslich steht das 'selected' an anderer Stelle, aber das scheint nicht ausreichend zu sein, *g*.

          Ernsthaft: Ich hatte zuerst versucht alternierend immer eine Leerzeile an das Select anzuhängen bzw. wegzulassen, hab's dann aber verworfen.

          Vorläufig habe ich es erstmal so gelöst das direkt nach dem Formular mit dem SelectFeld eine JavaScriptzeile ausgeführt wird welche dann den selektierten Eintrag 'nochmal' selektiert:

          [...]
          <select name="SELECTNAME" onchange="FORMNAME.submit();" style=" max-width: 200px;">
            <option value="1">Text 1</option>
            <option value="2">Text 2</option>
            <option selected value="3">Text 2</option>
            <option value="4">Text 2</option>
            <option value="5">Text 2</option>
          </select>
          </form>

          <script type="text/JavaScript">
          <!--
             var SELECTED_ID =  2;
             document.FORMNAME.SELECTNAME.options[SELECTED_ID].selected = true;
          //-->
          </script>

          Das funktioniert sehr gut, (solange JS eingeschaltet ist).

          Aber leider habe ich eben gesehen das der IE anscheinend das max-width nicht berücksichtigt :(.

          Oh echt, - schreibe was für WebBrowser und Du drehst dich im Kreis, ... (der kann dies nicht, der mag das nicht) ...

          Viele Grüße,
          Horst

          1. Hi,

            Hm, ja, eigentlich ändert sich die HTML-Struktur ja ein wenig, schlieslich steht das 'selected' an anderer Stelle, aber das scheint nicht ausreichend zu sein, *g*.

            ja, da kann man jetzt streiten, ab wann es Struktur ist :-) Mozilla wählt das 'selected' jedenfalls nach dem, was laut seiner History vom User selected wurde, auch wenn diese Selection durch Nichtänderung derselben stattfand. Äh, ich hoffe Du weißt, was ich meine :-)

            Ernsthaft: Ich hatte zuerst versucht alternierend immer eine Leerzeile an das Select anzuhängen bzw. wegzulassen, hab's dann aber verworfen.

            Whitespaces sind in HTML irrelevant.

            Vorläufig habe ich es erstmal so gelöst das direkt nach dem Formular mit dem SelectFeld eine JavaScriptzeile ausgeführt wird welche dann den selektierten Eintrag 'nochmal' selektiert:

            Hm, einfacher wär's gewesen, wenn Du meinem Hinweis auf geänderte URLs gefolgt wärst ...

            <script type="text/JavaScript">

            "text/JavaScript" ist, im Gegensatz zu "text/javascript", kein gültiger MIME-Type.

            Aber leider habe ich eben gesehen das der IE anscheinend das max-width nicht berücksichtigt :(.

            Ich hatte es fast befürchtet. In welcher Version?

            Oh echt, - schreibe was für WebBrowser und Du drehst dich im Kreis, ... (der kann dies nicht, der mag das nicht) ...

            Ich weiß ...

            Cheatah

            --
            X-Will-Answer-Email: No
            X-Please-Search-Archive-First: Absolutely Yes
            1. Hi,

              ja, da kann man jetzt streiten, ab wann es Struktur ist :-) Mozilla wählt das 'selected' jedenfalls nach dem, was laut seiner History vom User selected wurde, auch wenn diese Selection durch Nichtänderung derselben stattfand. Äh, ich hoffe Du weißt, was ich meine :-)

              Na Logo, *g*

              Vorläufig habe ich es erstmal so gelöst das direkt nach dem Formular mit dem SelectFeld eine JavaScriptzeile ausgeführt wird welche dann den selektierten Eintrag 'nochmal' selektiert:

              Hm, einfacher wär's gewesen, wenn Du meinem Hinweis auf geänderte URLs gefolgt wärst ...

              ???

              <script type="text/JavaScript">

              "text/JavaScript" ist, im Gegensatz zu "text/javascript", kein gültiger MIME-Type.

              OhHa, danke für den Hinweis, das sieht ganz nach einer großen Search/Replace Aktion auf meinem lokalen und auch WWW-Webbrowser aus :( (Das 'JavaScript' stammt nämlich aus einem Textbaustein, der sich sehr wahrscheinlich in jeder meiner Dateien die JavaScript beinhalten befindet) Arghh

              Aber leider habe ich eben gesehen das der IE anscheinend das max-width nicht berücksichtigt :(.
              Ich hatte es fast befürchtet. In welcher Version?

              Also mit width und max-width definiert zeigen es beide Browser im geschlossenen Zustand in der gewünschten Breite an. Beim Dropdown erweitert der Mozilla das Feld dann soweit es sein muß um alles Lesen zu können. Der IE nicht der damische ...

              Ich habe hier eine 6.0.2800 Version. Das Script wird aber verteilt, und somit sollte es für alle Browser(versionen) taugen.
              (Es ist eine PHP-Klasse zur Remote-Steuerung eines serverseitigen WinampPlayers, also eine Jukebox für lokale Netze)

              Oh echt, - schreibe was für WebBrowser und Du drehst dich im Kreis, ... (der kann dies nicht, der mag das nicht) ...

              Ich weiß ...

              Jaja, ... seufz, ...

              Horst

            2. Hallo Cheatah,

              Aber leider habe ich eben gesehen das der IE anscheinend das max-width nicht berücksichtigt :(.

              Ich hatte es fast befürchtet. In welcher Version?

              Der IE kennt weder max-width, max-height, min-width noch min-height. In *allen* Versionen. (für PC, wie es auf dem Mac aussieht, weiß ich nicht)

              Viele Grüße,
              Christian

              --
              Losung und Lehrtext für Mittwoch, 8. Oktober 2003
              Ich werde nicht sterben, sondern leben und des Herrn Werke verkündigen. (Psalm 118,17)
              In allem erweisen wir uns als Diener Gottes: als die Sterbenden, und siehe, wir leben; als die Gezüchtigten und doch nicht getötet; als die Traurigen, aber allezeit fröhlich; als die Armen, aber die doch viele reich machen. (2.Korinther 6,4.9.10)
              (http://www.losungen.de/heute.php3, i.V. Götz)
    2. Hi,

      Im Prinzip sind Eigenschaften nicht auf Tags bezogen, höchstens auf Tag-Arten (etwa "Blocklevel" oder "Inline"). Der "Fehler" besteht darin, dass width nicht die _maximale_ Breite ist und somit bei der Notwendigkeit einer größeren Breite gewissermaßen hinfällig wird.

      s/Tag-Arten/Element-Arten/g.

      Tag-Arten sind: start tag, end tag, (wie nennt sich jetzt eigentlich das tag eines XML-Elements, das leer ist und gleich mit /> geschlossen wird?)

      Dann war dieser ursprünglich selektiert. Lade die Seite mal mit gehaltener Shift-Taste neu.

      Was bringt das? Ich habe bisher keinen Unterschied zwischen F5 und Shift-F5 feststellen können (Ctrl-F5 dagegen ist anders als F5, nämlich Neuanfordern aller Ressourcen beim Server, auch wenn sie im Cache sind).

      cu,
      Andreas

      --
      Der Optimist: Das Glas  ist halbvoll.  - Der Pessimist: Das Glas ist halbleer. - Der Ingenieur: Das Glas ist doppelt so groß wie nötig.
      http://mud-guard.de/? http://www.andreas-waechter.de/ http://www.helpers.de/
      1. Hi,

        Im Prinzip sind Eigenschaften nicht auf Tags bezogen, höchstens auf Tag-Arten [...]
        s/Tag-Arten/Element-Arten/g.

        ja.

        Ich habe bisher keinen Unterschied zwischen F5 und Shift-F5 feststellen können (Ctrl-F5 dagegen ist anders als F5, nämlich Neuanfordern aller Ressourcen beim Server, auch wenn sie im Cache sind).

        Diese Tastenkombination ist natürlich browserabhängig. Ich muss gestehen, dass ich immer den Reload-Button bei gehaltener Shift-Taste betätige und nicht weiß, ob dies bei meinem Mozilla auch nur über die Tastatur geht. Anderseits bevorzuge ich aus Gründen der Gewohnheit auch Strg+R für den Tastatur-Reload ...

        Cheatah

        --
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
      2. Hallo Andreas,

        (wie nennt sich jetzt eigentlich das tag eines XML-Elements, das leer ist und gleich mit /> geschlossen wird?)

        empty-element tag.

        Grüße
        Thomas