Les sauts de ligne dans le tableau html

Comment puis-je arrêter ma table de l'augmentation de la largeur à chaque fois que j'insère loooong commentaire?

J'ai fait un exemple simple :

<!DOCTYPE html>
<html>
    <body>
        <table width='350'  border="0" align="center" cellpadding="3" cellspacing="1" class="table">
            <tr>
                <th id="row_style" bgcolor='#D6D6D6'>ID</th>
                <th id="row_style" width= "50%" bgcolor='#D6D6D6'>Content</th>
                <th id="row_style" bgcolor='#D6D6D6'>Date</th>
            </tr>
            <tr>
                <td id="row_style" bgcolor='#3399FF' scope='col' width='50'>Example</td>td>
                <td id="row_style" width ='10%'> Content</td>td>
                <td id="row_style" bgcolor='#3399FF' scope='col' width ='10%'>Example</td>td>
                <td width ='10%'></td>
            </tr>
        </table>
    </body>
</html>

Quand j'augmente le mot "contenu" de la largeur de la table est en augmentation.. comment puis-je arrêter cette et insérer un saut de ligne?

OriginalL'auteur Ion Farima | 2013-01-05

  1. 11

    Vous pouvez le faire en définissant une largeur de la table et vous pouvez également utiliser 

    word-wrap:break-word;

    Afin de prévenir à très long termes de sortir des frontières.

    Largeur est le meilleur jeu dans le css:

    Edit: inclure 

    table-layout:fixed;

    Démo

    http://jsbin.com/atonut/1/edit

    table {
width:500px;
table-layout:fixed;
}


td {
word-wrap:break-word;
}

    Si votre problème est beaucoup de texte plutôt incroyablement long termes, seule l'utilisation de la largeur et de laisser le word-wrap. Espérons que cela aide.

    Désolé, mais les deux réponses ne fonctionne pas 🙁
    Okey..il semble bien fonctionner...merci beaucoup! 😉

    OriginalL'auteur user1721135

  2. 0

    Voici la réponse : 

    <table width='350'  border="0" align="center" cellpadding="3" cellspacing="1" class="table">
                <tr>
                    <th id="row_style" bgcolor='#D6D6D6'>ID</th>
                    <th id="row_style" width= "10%" bgcolor='#D6D6D6'>Content</th>
                    <th id="row_style" bgcolor='#D6D6D6'>Date</th>

                </tr>
<tr>
                            <td id="row_style" bgcolor='#3399FF' scope='col' width='10%'>Example</td>
                            <td id="row_style" width ='10%'> Contentd</td>
                            <td id="row_style" bgcolor='#3399FF' scope='col' width ='10%'>Example</td>
                            <td width ='10%'>
</body>
</html>

    OriginalL'auteur user1942990

  3. 0

    Ajouter Du Style 

     

td 
{ 
border: solid 1px #000000; 
padding: 5px; 
} 
th 
{ 
border: solid 1px #000000; 
padding: 5px; 
} 
/* @media print 
{ 
table 
{ 
page-break-after: toujours; 
} 
}*/

    De donner du Style À tr:

    style="page-break-inside: éviter;"

    OriginalL'auteur Riddhi

  4. 0

    A l'air terrible, mais vous devez utiliser:

    <tr><td><br></td></tr>

    OriginalL'auteur daniel assayag