Ben Weichert: trotz overflow=auto wird Inhalt eines DIV gestaucht

Hallo,
ich bin erfreut, dass das Komplette Problem bereits in der Betreffzeile Platz gefunden hat, trotzdem möchte ich es noch einmal erläutern:

Ich habe da eine Tabelle mit X Spalten, die je 150px. Um die Seite nicht zu sprengen, wollte ich sie in ein DIV reintun, das bei bedarf horizontal scrollbar ist.
Das Ganze sieht am Ende so aus:

<div style="width:750px; height:70px; overflow: auto; background-color: #F9F9F9; layer-background-color: #CCCCCC; border: 1px none #000000;">
  <table border="0" cellspacing="3" cellpadding="3">
    <tr>
      <td class="intopicnav_top_aktiv"> Seite 1 a</td>
      <td class="intopicnav_child"><a href="/display/projekt/Seite+1+a+1">Seite 1 a 1</a> </td>
      <td class="intopicnav_child"><a href="/display/projekt/Seite+1+a+2">Seite 1 a 2</a> </td>
      <td class="intopicnav_child"><a href="/display/projekt/Seite+1+a+3">Seite 1 a 3</a> </td>
      <td class="intopicnav_child"><a href="/display/projekt/Seite+1+a+4">Seite 1 a 4</a> </td>
      <td class="intopicnav_child"><a href="/display/projekt/Seite+1+a+5">Seite 1 a 5</a> </td>
    </tr>
  </table>
</div>

Die Styles (intopicnav_*) sagen u.a., dass jede Zelle 150px breit ist.
Trotzdem wird die Tabelle nicht mit ihrer geplanten Breite von 6*150=900 Pixeln dargestellt, sondern auf die 750 Pixel des DIV gestaucht ... ich will aber nen Scrollbalken!

Wär toll, wenn jemand nen Tipp hätte,
Danke
-Ben

  1. Hallo!

    Ich habe da eine Tabelle mit X Spalten, die je 150px. Um die Seite nicht zu sprengen, wollte ich sie in ein DIV reintun, das bei bedarf horizontal scrollbar ist.

    Dann brauchst du aber overflow:scroll; und nicht auto.
    Näheres zu overflow findest du hier.

    --
    Lg,
    Snafu
    1. Hallo,

      Ich habe da eine Tabelle mit X Spalten, die je 150px. Um die Seite nicht zu sprengen, wollte ich sie in ein DIV reintun, das bei bedarf horizontal scrollbar ist.
      Dann brauchst du aber overflow:scroll; und nicht auto.
      Näheres zu overflow findest du hier.

      Dann käme aber immer ein Scrollbalken. Bei „auto“ erscheint er dagegen nur, wenn es nötig ist.

      mfg. Daniel

      1. Dann käme aber immer ein Scrollbalken. Bei „auto“ erscheint er dagegen nur, wenn es nötig ist.

        Jenau, so weit war ich auch schon ;)

        1. Hallo,

          Dann käme aber immer ein Scrollbalken. Bei „auto“ erscheint er dagegen nur, wenn es nötig ist.

          Jenau, so weit war ich auch schon ;)

          Ich habe mir deinen Code nochmal angeschaut.

          <div style="width:750px; height:70px; overflow: auto; […]

          Du weist dem <div> eine Breite zu. Das würde bedeuten, dass die Scrollbalken nur kommen, wenn der Inhalt eine größere Breite als 750px benötigt. Mit der Fenstergröße hat das also nicht mehr viel zu tun.

          mfg. Daniel

          1. Hy nochmal,

            Du weist dem <div> eine Breite zu. Das würde bedeuten, dass die Scrollbalken nur kommen, wenn der Inhalt eine größere Breite als 750px benötigt.

            Richtig, das war der Plan !!

            Mit der Fenstergröße hat das also nicht mehr viel zu tun.

            Äh, nö... es ging ja auch nur um das DIV ;)

            Trotzdem klappt was noch nicht: Firefox ignoriert meine Bemühungen nach Kräften!!
            Ich hab meiner Tabelle nun style="table-layout:fixed;" verpasst und die TDs haben allemann styles wie dieses:

            .intopicnav_top {
             background-color: #CCCCCC;
             border: 2px solid #333333;
             text-align: center;
             vertical-align: middle;
             padding: 4px;
             width: 150px;
             min-width: 150px;
             min-height: 50px;
                    overflow:hidden;
                    text-overflow:ellipsis;
            }

            IE7 zeigt das auch brav richtig an, sogar mit der auto-scrollbar im DIV, aber Firefox kooperiert nicht. Weder erzwingt er die Größe der Zellen, noch schneidet er die Inhalte ab, dabei steht in Selfhtml, dass FF1 das alles kann ...

            Hat da noch jemand ne Idee?
            Ist da noch wer? ^^

            -Ben

            1. Hallo,

              Du weist dem <div> eine Breite zu. Das würde bedeuten, dass die Scrollbalken nur kommen, wenn der Inhalt eine größere Breite als 750px benötigt.

              Richtig, das war der Plan !!

              Na dann funktionierts doch. Jedenfalls erscheint dort in meinem Firefox (2) ein Scrollbalken.

              mfg. Daniel

              1. Na dann funktionierts doch. Jedenfalls erscheint dort in meinem Firefox (2) ein Scrollbalken.

                mfg. Daniel

                Ha-ha, genau, das funktioniert. Aus der Sache hatte sich dann noch ein anderes Problem ergeben, dazu hab ich aber ein neues Thema erstellt:
                https://forum.selfhtml.org/?t=151095&m=982405

  2. hi,

    Ich habe da eine Tabelle mit X Spalten, die je 150px.

    Warum bringst du denn eine Navigation überhaupt in einer Tabelle unter?

    Und hältst du es für sinnvoll, eine Navigation anzulegen, dass sie teilweise erst durch Scrollen zugänglich wird?

    Die Styles (intopicnav_*) sagen u.a., dass jede Zelle 150px breit ist.
    Trotzdem wird die Tabelle nicht mit ihrer geplanten Breite von 6*150=900 Pixeln dargestellt, sondern auf die 750 Pixel des DIV gestaucht ... ich will aber nen Scrollbalken!

    Vielleicht würde table-layout helfen.
    Das ganze in einer sinnvolleren Struktur auszuzeichnen, wäre aber weitaus empfehlenswerter.

    gruß,
    wahsaga

    --
    /voodoo.css:
    #GeorgeWBush { position:absolute; bottom:-6ft; }
    1. HY wahsaga,

      danke für die Antwort, das hat spontan geholfen, genau sowas hatte ich gesucht. Da ich mich aber in der Vergangenheit als CSS-Muffel etabliert habe, musste ich erstmal mit der Nase drauf gestossen werden. Danke dafür, ich gelobe, mich zu bessern ;)

      Was die Sinningkeit des angestrebten Konstrukts angeht kann ich nur sagen: ist nicht auf meinem Mist gewachsen. Es soll erstmal so aussehen, da die maximale Anzahl der möglichen Navigationspunkte nicht definiert ist, diese Unternavigation aber nicht die Seite sprengen soll.
      Die Hauptnavigation des Ganzen ist ein baumartiges Menü der Oberkategorien, was auf jeden Fall übersichtlich ist.

      CU
      -Ben