Autor | Zpráva | ||
---|---|---|---|
Darkry Profil |
#1 · Zasláno: 17. 2. 2012, 12:51:40
Zdravím,
mám takový menší problém s nastylováním tabulky jednoduchého nákupního košíku: ![]() Celý košík chci mít jako jednu tabulku. A společne s tím nastává hned několik problémů: 1) Musím tabulce nastavit border-collapse: collapse; abych neměl mezery mezi jednotlivými buňkami, ale zároveň potřebuji aby byl rámeček oddělený mezi řádky.
2) Nemůžu celém řádku nastavit rámeček a pozadí, protože poslední buňka už ho nemá. Obrázkovým pozadím řádku se to také moc dobře vyřešit nedá, protože ta délka řádku je pohyblivá. Nenapadá vás tedy, jak nejlépe to nastylovat? Díky |
||
Trejpa Profil |
#2 · Zasláno: 17. 2. 2012, 16:32:15
Darkry:
To je problém tabulek, pomocí border-collapse a border-spacing nelze rozlišit svislé a vodorovné mezery. Obrázkovým pozadím se to vyřešit dá velmi elegantně a to bez použití dalších prvků. Nicméně je nutno pojmenovávat první a poslední buňku v řádku, protože ne každý prohlížeč zvládne adresovat buňky podle elementů col a colgroup, potažmo pseudoelementů :first nebo :first-child. Formátování tabulky |
||
Darkry Profil |
#3 · Zasláno: 17. 2. 2012, 20:39:44
Trejpa:
Díky. Nakonec jsem to vyřešil tím, že jsem za každý řádek přidal jeden prázdný a pozadí a rámeček jsem nenastavil řádkům, ale přímo buňkám tím pádem jsem nebyl nucen použít žádný obrázek a vše funguje jak má. |
||
Časová prodleva: 3 dny
|
|||
peta Profil |
http://axpsu.fpf.slu.cz/~web/navody/html/tabulky.htm
Obrazek je fajn, ale... Kdyz text pretece pres 2 radky, obrazek se spatne vykresli. Jinak je to dobre reseni. Osobne bych oramovani podbarvene bunky uz nedelal. spis podbarvil sudy / lichy radek. ciste teoreticky bych to resil jako: -------ramecek nahore ------ |..............................................................................................................................| |----- obrazek left=0% ---- ----- obrazek left=50% ---- ----- obrazek left=100% ----| obrazek bottom = 100% U obrazku spodek bude mit pruhlednych treba 5px. Musis pouzit:fisrt-child, :last-child (ktere funguje ale od IE7 tusim se spravnym doctype) nebo class na bunky. <style>tr td {} tr td.fist {} tr td.last {}</style> <tr><td class=first></td> <td></td> <td class=last></td> </tr> <style>tr td {} tr td:fist-child {} tr td:last-child {}</style> <tr><td></td> <td></td> <td></td> </tr> To tve reseni, pridat tam prazdny radek je take dobre reseni, ale pridava to html kod. |
||
Časová prodleva: 14 let
|
0