2016-05-02 5 views
1

Ich möchte Datenbank zu Tabellen anzeigen, aber wenn der Text, den ich anzeigen möchte, zu lang ist, wird der Text nicht direkt untergehen. der Text auf "Frage" wird nicht direkt eingegeben. bitte helfenWie Datenbank zu Tabellen anzuzeigen und der Text direkt gehen

dies ist mein Code:

<table class="table"> 
         <thead> 
         <tr> 
         <th>No</th> 
         <th>Question</th> 
         <th>A</th> 
         <th>B</th> 
         <th>C</th> 
         <th>D</th> 
         <th>Answer</th> 
         <th>Button</th> 
         </tr> 
         </thead> 
         <tbody> 
         <?php 
         include "conection.php"; 
         $no = 1; 
         $query = mysql_query("SELECT * FROM grammar"); 
         if ($query) { 
         while ($row = mysql_fetch_array($query)) { 
          echo " 
           <tr> 
            <td>".$no."</td> 
            <td>".$row['question']."</td> 
            <td>".$row['a']."</td> 
            <td>".$row['b']."</td> 
            <td>".$row['c']."</td> 
            <td>".$row['d']."</td> 
            <td>".$row['answer']."</td> 
            <td> 
             <a href=\"update.php?id=\">Edit</a> | 
             <a href=\"delete_grammar.php?id=\">delete</a> 
            </td> 
           </tr>"; 
          $no++; 
          } 
         } 
         ?> 
         </tbody> 
        </table> 

dies ist das Bild: enter image description here

+0

lesen Sie diese http://stackoverflow.com/questions/4457506/set-the-table-column-width-constant-regardless-of-the-amount-of-text-in-its-cell –

Antwort

1

Versuchen word-wrap: break-word; in Ihrem Stil verwenden. Wenn die maximale Breite erreicht wird, wird die Saite abgesenkt.

<table class="table"> 
         <thead> 
         <tr> 
         <th>No</th> 
         <th>Question</th> 
         <th>A</th> 
         <th>B</th> 
         <th>C</th> 
         <th>D</th> 
         <th>Answer</th> 
         <th>Button</th> 
         </tr> 
         </thead> 
         <tbody> 
         <?php 
         include "conection.php"; 
         $no = 1; 
         $query = mysql_query("SELECT * FROM grammar"); 
         if ($query) { 
         while ($row = mysql_fetch_array($query)) { 
          echo " 
           <tr> 
            <td>".$no."</td> 
            <td style='width:40%; word-wrap: break-word;'>".$row['question']."</td> 
            <td>".$row['a']."</td> 
            <td>".$row['b']."</td> 
            <td>".$row['c']."</td> 
            <td>".$row['d']."</td> 
            <td>".$row['answer']."</td> 
            <td> 
             <a href=\"update.php?id=\">Edit</a> | 
             <a href=\"delete_grammar.php?id=\">delete</a> 
            </td> 
           </tr>"; 
          $no++; 
          } 
         } 
         ?> 
         </tbody> 
        </table> 

ist die Probe JSFiddle

+1

Es wäre besser, wenn Sie hier relevanten CSS-Code hinzufügen würden. – Thamilan

0

Die Antwort von Lee finden Sie das Ergebnis, das Sie brauchen, bekommen aber beachten Sie, dass alle Längen der Wörter können auf diese Weise brechen, wenn sie eine Reihe Breite erreichen, die Lesbarkeit verringern kann. Der Screenshot, den Sie aufgenommen haben, stellt diese Spalte als ein Fragefeld dar. Diese Frage sieht wie ein potenziell unrealistischer Test des Inhalts aus, aber es ist gut, Kuriositäten zu berücksichtigen. E-Mail-Adresse oder URL-Spalten können dieses Problem von Überlaufproblemen haben und die Lesbarkeit ist möglicherweise nicht so wichtig für einen Benutzer. Die meisten Benutzer möchten wahrscheinlich die Frage schnell lesen können und gebrochene Wörter können das schwierig machen.

Wenn möglich, wenn die Lesbarkeit noch benötigt wird, können Sie den Inhalt dieser Zelle in ein div mit Überlauf-x: automatisch oder ausgeblendet und Breite 100% je nach gewünschtem Ergebnis umbrechen.

Dies wird entweder solche seltenen Fälle abschneiden oder zumindest den Benutzer durch den Text scrollen lassen.

Der Container td benötigt eine bestimmte Breite in Pixeln oder eine andere Einheit, die nicht variabel ist, damit Tabellen in allen Browsern korrekt behandelt werden können. Wenn Sie möchten, können Sie stattdessen auch eine Pixelbreite auf dem Div hinzufügen, anstatt 100% Breite.

Verwandte Themen