CSS 100% de la largeur de la barre de défilement (overflow-x) dans une cellule de tableau
c'est mon premier post. Finalement, j'ai décidé de me joindre à vous tous à stackoverflow!
Mon problème est sur une barre de défilement horizontale qui a pour s'adapter à 100% à son conteneur. Dans l'exemple suivant, vous trouverez tout ce dont vous avez besoin pour comprendre mon problème.
Donc la question serait: pourquoi le code fonctionne dans le premier cas, mais quand imbriquée à l'intérieur d'une cellule de tableau (deuxième cas) puis la barre de défilement des débordements de son contenant? Pourquoi cela arrive et comment pourrait-il être fixé?
On pourrait dire: "tout se débarrasser des tables", mais j'ai besoin de ce code de travail dans un grand site qui a une certaine disposition de table. Se débarrasser des tables représenterait pour moi cents heures de travail.
Principale différence entre la première (correct) et la deuxième scrollb (incorrect) est:
Première de défilement (correct)
<div class="hscroll"> (images) </div>
Code CSS de la barre de défilement horizontale:
.hscroll {
overflow-x:scroll;
overflow-y:hidden;
white-space:nowrap;
}
Deuxième de défilement (incorrect)
<table><tr><td> (same code as first scroll) </td></tr></table>
Je vais apprécier votre sage suggestions très bien.
Gérard.
OriginalL'auteur Gerard | 2013-04-06
Vous devez vous connecter pour publier un commentaire.
table { table-layout: fixed; }
La table fixe résolu pour moi.
Modifier: semble que je suis à quelques secondes trop tard!
OriginalL'auteur Michael Theriot
Ajouter
table-layout: fixed;
à votre.table
classe.Voici un exemple:
http://jsfiddle.net/cexUr/2/
+1 par exemple, il faut l'accepter. Devriez essayer d'utiliser la nouvelle inline extraits.
OriginalL'auteur Kaloyan