Autor Zpráva
demonek@seznam.cz
Profil
Ahoj,
chtel jsem pouzit funcionalitu overflow:ellipsis a mel jsem predstavu, ze mi hodi tecky na konec bunky u pretekajiciho textu. Tedy ze mi toho do bunky vypise nejvice textu co se vejde a az na konec hodi tecky. Bohuzel mi to zobrazi jen prvni radek. Mozna to zpusobuje parametr white-space:nowrap; ale bez nej to nufunguje vubec. Nevite nekdo jak to udelat, aby mi to text ktery se do bunky nevejde oznacil teckami az na konci bunky a ne na konci prvniho radku? Predem diky

 <div style = "width:14%; height:14%; background-color:lightblue;overflow:hidden;white-space:nowrap;
    text-overflow:ellipsis;">
   askjchbasljchsljhclajskclcnslhnlshndalkhdnlkhnlks xxxxxxxxxxxxxxxxxxxxxxxxxxyyyyyyyyyyyyyyy123456
   
   </div >

P.S.:Zkusil jsem jeste vymenit parametr white-space:nowrap za word-wrap: break-word a to v postate funguje, jen to na konec nehodi ty tecky, to by se mi hodilo.
Str4wberry
Profil
Ano, white-space: nowrap způsobí, že se text nebude zalamovat, nemůže tedy vytvořit více řádků.

Myslím, že to, co chcete udělat, čistě v CSS pro všechny prohlížeče nepůjde.

V Opeře 12 funguje:
text-overflow: -o-ellipsis-lastline
Ukázka.

V ostatních prohlížečích bude asi ideální JS řešení. Jde to sice i nahackovat v CSS, ale moc elegantní to není.
demonek@seznam.cz
Profil
Str4wberry:
Diky za odpoved. Problem je asi v tom, ze se mezi sebou triskaji parametry pro tabulku viz nize:
verflow:ellipsis jiz funguje, ale bunka tabulky se mi roztahuje dolu a nehledi na parametr overflow:hidden;
To mi hlava nebere.

<
<!DOCTYPE html>
<html lang='cs'>
  <head>
    <title></title>
    <meta charset='utf-8'>
    <meta name='description' content=''>
    <meta name='keywords' content=''>
    <meta name='author' content=''>
    <meta name='robots' content='all'>
    <!-- <meta http-equiv='X-UA-Compatible' content='IE=edge'> -->
    <link href='/favicon.png' rel='shortcut icon' type='image/png'>
    
    
    <style type="text/css"> 
     html {margin:0;padding:0;height:100%;/*overflow:hidden;*/} 
     body {margin:0;padding:0;height:100%;/*overflow:hidden;*/} 
     table {border:solid black 2px; border-collapse: collapse; text-align:center;width:100%;height:100%;table-layout: fixed;}
     td,th  {border:solid black 2px;width:14%;height:14%;overflow:hidden;text-overflow:ellipsis;}
      
     </style>
  </head>
  <body>
   
   <table>
    <tr><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td></tr>
    <tr><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td></tr>
    <tr><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td></tr>
    <tr><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td></tr>
    <tr><td>x</td><td>x</td><td>x</td><td>
    11111111111111111111111111111111111111111111
    22222222222222222222222222222222222222222222
    33333333333333333333333333333333333333333333
    44444444444444444444444444444444444444444444
    55555555555555555555555555555555555555555555
    66666666666666666666666666666666666666666666
    77777777777777777777777777777777777777777777
    88888888888888888888888888888888888888888888
    99999999999999999999999999999999999999999999
    12122121212121212121212121212122121212121212
    </td><td>x</td><td>x</td><td>x</td></tr>
    <tr><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td></tr>
    <tr><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td><td>x</td></tr>
   </table>

  </body>
</html
Str4wberry
Profil
Buňka tabulky nemá nic jako maximální výšku. Výška funguje jako minimální s tím, že se může zvýšit. Ani ten table-layout: fixed na to nefunguje.

Řešení je dvojí:

1) Použít další element uvnitř buňky, kde už omezení výšky bude fungovat (ukázka). Potom je ale „ellipsis“ k ničemu.
2) Zabránit zalamování řádku nowrapem, jak jste to měl, ale obsah potom bude jen v jednom řádku (ukázka).

Je-li cílem mít možnost zapsat více řádků a v případě dlouhého textu mít na konci posledního řádku trojtečku, budete asi muset sáhnout po JavaScriptu nebo tom šíleném CSS, co jsem odkazoval.
demonek@seznam.cz
Profil
Díky za pomoc. Moc jste mi pomohl.
Str4wberry
Profil
Jaké řešení jste nakonec použil?

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: