Sloupce v tabulce s danou a proměnnou šířkou

Na DJPW se objevil dotaz, jak mít u čtyř sloupců pevnou šířku, tak Vám napíšu řešení i sem na web. Základem úspěchu je nebát se používat vlastnost min-width, což znamená minimální šířku.

HTML + CSS:

<table style="text-align: left; width: 1800px;" border="1">
  <tbody>
    <tr>
      <td style="max-width: 75px; word-wrap: break-word">První řádek (neměnný) A je tu hrozně
dlouhý text - 8956254564184</td>
      <td style="max-width: 75px; word-wrap: break-word">První řádek (neměnný) A je tu hrozně
dlouhý text - 8956254564184</td>
      <td style="max-width: 75px; word-wrap: break-word">První řádek (neměnný) A je tu hrozně
dlouhý text - 8956254564184</td>
      <td style="max-width: 75px; word-wrap: break-word">První řádek (neměnný) A je tu hrozně
dlouhý text -  8956254564184. Klidně se i zalomí...</td>
      <td style="min-width: 10px;">Pohodlně dlouhý text, kterému se
buňka přizpůsobí</td>
      <td style="min-width: 10px;">Pohodlně dlouhý text, kterému se
buňka přizpůsobí a může být stráááááááááááááááááááááááááááááááááááááááššššššššššššššněěěěěěěěěěěěěěěě dlouuuuuuuuuuuuuuhýýýýýýý</td>
    </tr>
  </tbody>
</table>

Živá ukázka

Napsat komentář

Vaše e-mailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *