/ Sweet home / Blog / Archives / Des lignes de tableau "à la Gmail" ... /

Des lignes de tableau "à la Gmail" ...

... c'est à dire sans coupure de ligne et sans pour autant que la cellule ne change de taille en cas de dépassement ? C'est assez simple en associant la propriété de tableau "table-layout" à sa valeur "fixed", la propriété "white-space" et les éléments "colgroup" et "col":
/* CSS */
table
{
  border:1px solid black;
  padding:10px;
  background-color:pink;
  width:100%;
  table-layout:fixed;
}
td
{
  overflow:hidden;
  white-space:nowrap;
  width:100%;
}
Résultat : une ligne de tableau parfaitement flexible. :-)

Last update: 2010-09-05 07:16:06


<< Design SQL dans le navigateur
Hello world! >>
 

Comment this





Benchmark ! :-)

  1. dispatch
    time  : 0.0475
    memory: 540.84 kb
  2. cms\controllers\Index::norouteAction: find published page
    time  : 0.0047
    memory: 210.11 kb
  3. cms\controllers\Index::norouteAction: find template
    time  : 0.0001
    memory: 1.22 kb
  4. cms\controllers\Index::norouteAction: find layout
    time  : 0.0001
    memory: 1.13 kb
  5. cms\models\Page::getPublishedChildren
    time  : 0.0269
    memory: 373.39 kb
  6. cms\models\Page::getAncestors
    time  : 0.0089
    memory: 305.24 kb
  7. cms\models\Page::getParent
    time  : 0.0088
    memory: 303.66 kb
  8. cms\models\Page::getPublishedLeftSibling
    time  : 0.0046
    memory: 102.04 kb
  9. cms\models\Page::getPublishedRightSibling
    time  : 0.0031
    memory: 101.95 kb
  10. cms\models\Page::getPublishedComments
    time  : 0.0010
    memory: 28.01 kb