responsive scrolling tabela

Zdravo,

ali ima kdo kakšno idejo, kako bi lahko pravilno naredil responsive tabelo, ki ima v tbody scroller. Problem imam ker ne morem ujeti enake širine stolpcev med thead in tbody.

Primer: link do tabele

hvala

v teoriji dodas v glavo en dodaten stolpec za sirino scrollerja

neki maš fiksirano, ker jo ne spremeni na mnajših res.

#wrapper

min-width vn

max-width: 980px



that's it

Blah...tole sem napisal, ker sem mislil, da ti dela responsive problem pri manj kot 980px... Sori :)

Nova rešitev:

.scrollableContainer .scrollingArea table thead tr

pobriši styling iz tega classa in bo delalo. Zakaj dejansko si sploh to vstavil?

EDsolution:

Nova rešitev:

.scrollableContainer .scrollingArea table thead tr

pobriši styling iz tega classa in bo delalo. Zakaj dejansko si sploh to vstavil?

zato ker ne želim da se mi scrolla tudi thead. thead more biti fiksen.

@Draganche - to sem dal fiksno samo zato, da mi čez celo podaljša thead. Je neka xy cifra, ki gre komot ven, če najdem boljšo rešitev, ki pa je še zmeraj nisem našel :( sem tudi malo googlal in ni nič pametnega. Vse je za fiksno širino tabele, kar pa že tko ni prblem narediti.

lp

vsekakor si malo zakompliciral to da imaš fiksni th. Če sem te prav razumel potem je lepša rešitev ta, vendar ne reši problema poravnave vrstic.

<table style="width: 100%" border=1>

<tr><th style="width: 20%">Ime</th><th style="width: 50%">Priimek</th><th style="width: 30%">Datum</th></tr>

<tr><td colspan="3">

<div style="overflow: auto; height: 100px;">

<table style="width: 100%;" border=1>

<tr><td style="width: 20%">Janez</td><td style="width: 51.3%">Novak</td><td style="width: 28.0%">1.1.2013</td></tr>

<tr><td>Janez</td><td>Novak</td><td>1.1.2013</td></tr>

<tr><td>Janez</td><td>Novak</td><td>1.1.2013</td></tr>

<tr><td>Janez</td><td>Novak</td><td>1.1.2013</td></tr>

<tr><td>Janez</td><td>Novak</td><td>1.1.2013</td></tr>

<tr><td>Janez</td><td>Novak</td><td>1.1.2013</td></tr>

</table>

</div>

</td></tr>

to najverjetneje ne boš moral rešit na tak način, saj je sam scroller fiksne širine, kar ti uniči razmerja.

kaj pa če daš ta stil na thead in ne na th?

Sicer pa tole ni lih responsive, ker se ti pri manj kot 980px nic ne zgodi.

@EDsolution - nevem zakaj se obremenjuješ tok s temi 980px, če je navedeno samo kot primer?

Nekako mi je uspelo rešiti problem. Če bo kdo kdaj potreboval, si lahko pogleda na linku

hvala vsem za nasvete.

lp