Georf: Textbreite variieren

Hallo,
Ich habe ein Problem, was mich jetzt schon ein paar Tage beschäftigt, aber wofür ich noch keine Lösung gefunden habe.

Ich will einen Kalender mittels HTML anzeigen lassen. Für jeden Tag könnten dort bestimmte Termine dargestellt werden. Also so ähnlich wie der Google-Kalender, nur nicht mit Uhrzeiten, Tage reichen mir.

Nun ist mir dabei aufgefallen, dass ich in diesen Spalten wenig Platz habe um einen längeren Namen für den Termin anzuzeigen. Also wird die Tabelle automatisch breiter oder die Spalten nicht mehr gleich breit.

Bei dem Google-Kalender wird bei einem zu langen Namen einfach der Text ausgeblendet. Das kann man sehr schön beobachten, wenn man die Größe des Browser verändert.

Ich weiß, dass man mittels overflow:hidden einen zu langes Wort "verstecken" kann. Allerdings funktioniert das nicht, wenn ich white-space:nowrap; setze.

Ich will also nur den Anfang des Textes anzeigen lassen und für jeden Termin auch nur eine Zeile brauchen. Beim Google-Kalender geht das. Bei mir nicht.

Hatte schon mal jemand so ein Problem und weiß eine Lösung darauf oder kann mir vllt einen Tipp geben?

Vielen Dank schon mal.
Georf

  1. Grüße,
    ehrlich gesagt, scheitere ich bereits beim versuch deine frage zu verstehen.
    wie sieht die tabelle aus? 2 spalten tag/termin?
    was willst du erreichen? fixe spaltenbreite?
    MFG
    bleicher

    1. Es ist auch bisschen schwer zu erklären ;)

        
      <!-- Ich habe ein vorgegeben Platz, der nicht breiter werden soll -->  
      <div style="width:100px;border:solid 1px red;">  
      <!-- Da drin ist eine Tabelle, die gleichbreite Spalten haben soll -->  
      <table style="width:100%;">  
      <tr>  
      <!-- Der folgende Text soll nur zur Hälfte angezeigt werden, der Rest soll vom nächsten Element verdeckt werden, geht aber nicht:-->  
      <td style="width:50%;overflow:hidden;">Testtesttest</td>  
      <td style="width:50%;overflow:hidden;">Testtesttest</td>  
      </tr>  
      </table>  
      </div>  
      
      

      Dieses Beispiel kann man sich hier nochmal angucken.

      Grüße,
      ehrlich gesagt, scheitere ich bereits beim versuch deine frage zu verstehen.
      wie sieht die tabelle aus? 2 spalten tag/termin?
      was willst du erreichen? fixe spaltenbreite?
      MFG
      bleicher

      1. Hi,

        abgesehen davon, dass ich sowas etwas fragwürdig finde...

        <td style="width:50%;overflow:hidden;">Testtesttest</td>

        sollte es so gehen:

        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
        <html>
        <head>
        <style type="text/css">
        table {
            width:100px;
            table-layout:fixed;
        }
        td {
            border: 1px solid red;
        }
        td div {
            overflow: hidden;
            white-space: nowrap;
        }
        </style>
        </head>
        <body>
            <table>
                <tr>
                    <td><div>sfdgs sdfgbdfgb dfgbdfgb dfgbdfgb dfgbdfgb </div></td>
                    <td><div>ewrgfthe ergfh dfgbdfgbdfgb edrgfhdfgbertghergftbesdr</div></td>
                </tr>
            </table>
        </body>
        </html>

        Gruesse, Joachim

        --
        Am Ende wird alles gut.
        1. Ich bedanke mich schon mal sehr, das ist genau das, was ich suchte. Habe aber trotzdem noch eine Frage zu deiner Aussage:

          Hi,

          abgesehen davon, dass ich sowas etwas fragwürdig finde...

          <td style="width:50%;overflow:hidden;">Testtesttest</td>
          sollte es so gehen:

          Was ist daran fragwürdig?

          PS: Das ist echt gut, mit dem Table-layout. Man lernt immer dazu ;)

          1. Hi,

            Was ist daran fragwürdig?

            Generell ist sowas für mich eher eine Liste als eine Tabelle. Im Speziellen finde ich das schlichte Abschneiden unschön. Ich würde eher serverseitig die Stringlänge begrenzen und das "Abschneiden" z.B mit "..." symbolisieren.

            Gruesse, Joachim

            --
            Am Ende wird alles gut.
            1. Achso, ja dann verstehe ich dich. Das mache ich bei anderen Sachen ja auch so, allerdings ist dieser Kalender, den ich gerader baue zwischen zwei Divs "eingeklemmt". Wenn jetzt jemand schon alleine seine minimale Schriftgröße hochgesetzt hat, passen die Wörter nicht mehr in die Felder und alles verzieht sich.
              Ich sehe solche Seiten öfters, da ich unter Linux nicht unbedingt die Schriftarten habe, die von den Seiten vorgegeben werden. Für andere ist es wiederum selbstverständlich Javascript eingeschaltet zu haben. Bei manchen sogar so stark, das man keine Inhalte auf der Seite ohne JS hat. So etwas finde ich immer ein bisschen schade, gerade wenn man schon an phpMyAdmin sieht, dass auch umfangreiche Seiten ohne JS funktionieren, wenn man gut ist.

              Naja, ich bedanke mich nochmal für deine Hilfe.
              Grüße Georf