Stylování tabulky

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

Kód:

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

tak nastav pozadi td (bunce) a posledni nastav jinak, aby vyhovovalo
styl pro td celkove td.prvni td.predposledni a td.posledni :)

edit:

oddeleni radku muzes resit dalsim, prazdnym, radkem v tabulce, nebo by urcite melo jit dostylovat tr :)

To sice jde, ale furt to neřeší problém se spojováním rámečků... Kdy by musely podle tebe horní a dolní rámečky každý buňky mít nemít nastavený collapse, ale boční rámečky ho nastavený mít, což už vůbec nejde :-)

Edit:
prázdný řádek by to asi řešil, ale neni to moc nejhezčí řešení. A dostylovat tr teda fakt nevim jak...

nerozumim.. ukaz co mas a co chces mit

Asi to fakt ale vyřešim těma volnejma řádkama s nějakou třídou, jinak by to asi moc řešit nešlo...

Zkus tohle, pokud jsem to dobře pochopil tak by jsi z toho mohl vyjít.

Kód:

table { border-collapse: collapse; }
td, th { padding: 5px; }
tr { display: block;margin: 5px;border-left: 1px solid #000; }
td { background: red;border: 1px solid #000;border-left: 0;border-right: 0; }
.no { background: none;border: none;border-left: 1px solid #000; }
.first { border: 0; }

Kód:

<table>
<tr class="first"><th>1</th><th>2</th><th>3</th><th>4</th><th>odstranit</th></tr>
<tr><td>1</td><td>2</td><td>3</td><td>4</td><td class="no">odstranit</td></tr>
<tr><td>1</td><td>2</td><td>3</td><td>4</td><td class="no">odstranit</td></tr>
<tr><td>1</td><td>2</td><td>3</td><td>4</td><td class="no">odstranit</td></tr>
<tr><td>1</td><td>2</td><td>3</td><td>4</td><td class="no">odstranit</td></tr>
</table>

Jo, díky. To funguje.

Přihoď bodík ;)

Ale je tam problém s tim, že teď tam mám ještě ten první tr s nadpisama (th) a jak se to má nastavený display: block tak se to buňky nepřizpůsobujou zbytku tabulky a jsou nejmenší možný. Jak tohle ještě opravit? http://www.webpagescreenshot.info/im...217201250102PM

Moje chyba, odstraň z css toto v tr {}:

Kód:

display: block;margin: 5px;

Teď by tam zase nebyly ty mezery, takže tam budeš muset přidat ten řádek no...

MaGnet: právě, takže nakonec přecejenom musim přidat prázdný řádky :-)

Tak stejně díky moc!