Autor Zpráva
KamilZm
Profil
Ahoj, nemohu přijít na strašnou ptákovinu. Mám tabulku a chci, aby byla přes celou šířku kontejneru, ve kterém je. Chtěl bych, aby poslední sloupec automaticky vyplnil zbývající místo, konkrétně takto, jako tabulka 1: http://jsfiddle.net/JZSjj/3/ . Problém ale je, že to dosáhnu pouze tak, že nastavím "white-space: nowrap;", jinak se první sloupec zalomí (viz tabulka 2). což nemohu. Když poslední sloupec neroztáhnu, tak se mi roztahají všechny proporcionálně, což je škaredé (tabulka 3). Je na to nějaký jednoduchý trik?
peta
Profil
white-space: nowrap
111 222 333 444
jinak se první sloupec zalomí
To je logicke, ze se zalomi, kdyz druha bunka ma mit sirku 100% a mas mezi tim bezne mezery a ne nbsp. Bys musel prvnimu sloupci nastavit sirku.

White-space: nowrap nebo nastavit width. Nic lepsiho mne nenapada.
KamilZm
Profil
Blbé je, že když nastavím width, tak to nebude univerzální, ale natvrdo. Když dám nowrap, tak to zase dělá bordel, když je v tabulce jen jeden sloupec s delším textem jak šířka místa pro tabulku.
tiso
Profil
Takže chceš druhý stĺpec na viac riadkov a prvý len na jeden?
td:first-child {
    white-space: nowrap;
}
Máš tam iba 2 stĺpce?
KamilZm
Profil
Chci, aby měly všechny sloupce minimální šířku nutnou pro zobrazení bez zalomení a poslední vyplnil případný zbytek. Pokud by nebylo místo, tak by se teprve začaly (klidně všechny) sloupce zalamovat. Sloupců je více, je to proměnné.
Zatím to mám udělané takto (LESS) takto, ale moc se mi ten způsob řešení nelíbí:
table 
{
        width: 100%;

        th:last-child // roztahnu posledni sloupec (staci hlavicka)
        { width: 100%; }

        td // zakazu zalamovani (roztazeni posledniho by ho automaticky vyvolalo)
        { white-space: nowrap;  }

        td:last-child // ale kdyby to byl jediny, tak mu zalamovani povolim, aby nepretekl
        { white-space: normal; }
}
Taková primitivní věc přeci musí nějak rozumně jít :-)
peta
Profil
Pak tu mas moznost resit to pres js a vypocitavat si sam sirku bunek podle vlastnich pravidel.
(ten predchozi text jsem smazal, pac to bylo vlastne normalni chovani tabulky, pokud to nekdo cetl pred smazanim...)
Sir Tom
Profil
KamilZm:
Čeho se vůbec snažíš dosáhnout? Proč musí být první sloupec natěsnaný až k textu a poslední velký až k okraji DIVu?
Jedná se o např. ceníkovou tabulku, kde vlevo je cena s měnou a vpravo jsou informace k oné ceně?
KamilZm
Profil
Snažím se dosáhnout největší přehlednosti. Nejedná se jen o první sloupec, ale i o druhý, třetí, .... aby uživatel nemusel rejdit očima přes široký řádek, ve kterém jsou velké a zbytečné mezery (to by splňovala tabulka bez roztažení). Zároveň ale chci, aby to bylo trochu hezké, proto ta max. šířka (na stránce je více tabulek a je podstatně hezčí, když jsou všechny stejně široké, přestože uvnitř mají jinak široké sloupce).
Sir Tom
Profil
KamilZm:
Hezkou tabulku můžeš vytvořit i barvami - např. extra barvu pro záhlaví. Různé barvy pro sudé a liché řádky / sloupce. Různé barvy a styl písma pro různé hodnoty (např. kladná čísla černě, záporná červeně).
Aby uživatel nemusel rejdit očima přes široký řádek stačí mít neširoký řádek. V opačném případě vždy někde budeš mít volné místo - buď uprostřed nebo na konci.

Tvůj problém se dá také řešit takto:
Celé tabulce dej šířku 100 % (nebo tolik kolik budeš chtít). Všem buňkám, který mají být natěsno k obsahu dej velikost např. jenom 1px (buňka se stejně roztáhne tak, aby byla těsně na obsah).
KamilZm
Profil
>V opačném případě vždy někde budeš mít volné místo - buď uprostřed nebo na konci.
Na konci to nevadí, protože nemá "roztahané" informace a podstatně lépe se to čte, než když má sloupec, pak 1/2 obrazovky místo (přeháním) a pak až další údaj. Která tabulka z prvního odkazu se Ti nejlépe čte? Mě jednoznačně č. 1.

>Celé tabulce dej šířku 100 % (nebo tolik kolik budeš chtít). Všem buňkám, který mají být natěsno k obsahu dej velikost např. jenom 1px (buňka se stejně roztáhne tak, aby byla těsně na obsah).
Tohle jsem zkoušel, ale vyžaduje to nowrap, jinak se to zaláme na mezerách, což nechci.

Každopádně díky moc za rady, ale evidentně to nepůjde :-(

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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