Opera <table> wrap bug

Je suit html/css:Opera <table> wrap bug

<html> 
<body> 
<style type='text/css'> 
.result_table table { 
    border-collapse:collapse; 
} 
.result_table table td { 
    white-space:nowrap; 
    max-width:200px; 
    overflow:hidden; 
    padding:4px; 
    max-height:24px; 
    height:24px; 
} 
</style> 
<div class="result_table"> 
<table border=1><thead><tr><td>Title</td></tr></thead> 
    <tbody> 
    <tr> 
    <td>Lorem ipsum dolor sit amet, ...</td> 
    </tr> 
    </tbody> 
</table> 
</div> 
</body> 
</html>

quand "Lorem impsum" a une grande longueur (plus de 9000 symboles), le navigateur Opera commence à envelopper le texte, même si il n'y a pas de symboles de rupture et TD a des directives Nowrap et Overflow.

enter image description here

autre célèbre navigateur toutes les bonnes:

enter image description here

Source

2011-03-15 heximal

Vous avez oublié de mentionner quelle version d'Opera. – SpliFF

http://jsfiddle.net/Kyle_Sevenoaks/ATEDV/ semble bien dans Opera 11.01 – Kyle

Fonctionne dans Opera 10.51 sur WinXP. – stealthyninja

possible overflow-y:hidden ne fonctionne pas avec display:table-cell dans Opera. O solution possible est d'ajouter display:block pour .result_table table td.

Démo:http://jsfiddle.net/qXjV8/

Une autre solution pourrait consister à envelopper le texte dans le td avec un div et changer le sélecteur .result_table table td div

Démo:http://jsfiddle.net/qXjV8/1/

Dans les deux cas, je vous conseille d'utiliser un reset css comme ceci: http://meyerweb.com/eric/tools/css/reset/

Aussi, vous remarquerez que dans les deux cas, la deuxième ligne dans Opera est partiellement visible. Pour résoudre ce problème, vous pouvez utiliser la propriété line-height.

Source

2011-03-15 11:25:17 Sotiris

affichage: bloc - bonne idée! Merci! – heximal

@heximal vous êtes les bienvenus :) – Sotiris

btw, j'ai trouvé "netsted div" solution moi-même, mais je ne voudrais pas l'utiliser en raison de la grande quantité de données générées. ça augmenterait la longueur du contenu – heximal

Opera <table> wrap bug

Répondre

Questions connexes